How do I, when someone enters an html tag in my online editor, javascript set a color for that tag? An example would be:
< html>
//Essa tag teria sua cor mudada por uma função
function Tag(){
//A função tag ao ser chamada iria setar uma cor
}
How to format html tags with javascipt
1
asked by anonymous 09.08.2018 / 16:02
2 answers
0
I recommend the javascript library highlight.js ( open-source ):
- 176 languages and 79 styles
- Automatic Language Detection
- Multi-Language Code Styler
- Available to node.js
- Works with any markup
- Compatible with any javascript library
Follow an example using highlight.js for javascript and css with the theme atelier-forest-dark :
//Função que inicializa o highlight.js para personalização das cores do código
hljs.initHighlightingOnLoad();<link rel="stylesheet" href="http://cdn.jsdelivr.net/gh/highlightjs/[email protected]/build/styles/atelier-forest-dark.min.css">
<script src="http://cdn.jsdelivr.net/gh/highlightjs/[email protected]/build/highlight.min.js"></script>Exemploestiloparacódigos<strong>javascript</strong>:<pre><codeclass="javascript">function funcaoTeste(block, cls) {
try {
if (cls.search(/\bno\-highlight\b/) != -1)
return process(block, true, 0x0F) +
' class="${cls}"';
} catch (e) {
/* comentário: captura da exceção */
}
}
</code>
</pre>
Exemplo estilo para códigos <strong>css</strong>:
<pre>
<code class="css">@font-face {
font-family: Chunkfive; src: url('Chunkfive.otf');
}
body, .textoUsuario {
color: #F0F0F0; background: #600;
font-family: Chunkfive, sans;
}
@import url(estilo.css);
@media print {
a[href^=http]::after {
content: attr(href)
}
}
</code>
</pre>
09.08.2018 / 21:10
0
It is possible to do this by the contenteditable="true" attribute in a div, for example.
09.08.2018 / 18:25