Редактор кода на javascript

244

14 июня 2018, 01:10

Есть редактор кода. Хочу, чтобы когда я написал любой элемент, например , то тогда слово закрашивалось в красный цвет, а если другой элемент, то и другой цвет. Сделайте это на javascrip.

function runCode() { 
	var content = document.getElementById('sourceCode').value; 
	var iframe = document.getElementById('targetCode'); 
	iframe = (iframe.contentWindow)?iframe.contentWindow:(iframe.contentDocument)? 
	iframe.contentDocument.document: iframe.contentDocument; 
 
	iframe.document.open(); 
	iframe.document.write(content); 
	iframe.document.close(); 
	return false; 
}

*{ 
  padding: 0; 
  margin: 0; 
} 
textarea, iframe { 
  border: 2px solid #ddd; 
  height: 500px; 
  width: 100%; 
} 
#sourceCode { 
  font-size: 1.2em; 
}

<table width="100%" border="0" cellspacing="5" cellpadding="5"> 
   <tr> 
   	 <td width="50%" scope="col">&nbsp;</td> 
     <td width="50%" scope="col" align="left"> 
     	<input onclick="runCode()" type="button" value="Run Code"> 
     </td> 
 </tr> 
     <td> 
     	<form> 
     		<strong>Code</strong> 
     		<textarea name="sourceCode" id="sourceCode"> 
     			<html> 
     			<head> 
     				<title>Hello</title> 
     			</head> 
     			<body> 
     				<h1>Hello</h1> 
     				<p>Write code</p> 
     			</body> 
     			</html> 
     		</textarea> 
     	</form> 
     </td> 
     <td><strong>OutPut</strong><iframe name="targetCode" id="targetCode"></iframe></td> 
 </table> 
</table>