How to change the replaced color?

Question

var elements = document.getElementsByTagName('*'); for (var i = 0; i < elements.length; i++) { var element = elements[i]; for (var j = 0; j < element.childNodes.length; j++) { var node = element.childNodes[j]; if (node.nodeType === 3) { var text = node.nodeValue; var replacedText = text.replace(/[word or phrase to replace here]/gi, '[new word or phrase]'); if (replacedText !== text) { element.replaceChild(document.createTextNode(replacedText),node); } } } }

This script should make words and replace them with others (this script is for expansion). Please help to remake it so that it changes the color of the replaced words, say red.

He looks for the word, then he will be replaced by another, but how can we make the replaced word be red
var replacedText = text.replace (/ [word or phrase to replace here] / gi, '<span style = "color: green"> [new word or phrase] </ span>');
It does not work to display all the text, he adds it as text instead of adding as code

Mykola Veriga Mykola Veriga 920 four nineteen · Accepted Answer · 2018-02-28T20:19:23

The fact is that you create a text element, and you need to create an element based on the markup.

Creating a new DOM element from an HTML string using DOM methods or Prototype

 var elements = document.getElementsByTagName('*'); for (var i = 0; i < elements.length; i++) { var element = elements[i]; for (var j = 0; j < element.childNodes.length; j++) { var node = element.childNodes[j]; if (node.nodeType === 3) { var text = node.nodeValue; var replacedText = text.replace(/яблок/gi,'<span class="red">pineapple</span>'); if (replacedText !== text) { var div = document.createElement('div'); div.innerHTML = replacedText.trim(); element.replaceChild(div.firstChild, node); } } } }

How to change the replaced color?

1 answer 1

More articles: