Chrome Extension changes words irregularly

Question

I tried making an extension that finds all words saying "found" and replacing them with "found" just for testing. It sometimes changes 1/2 the words, sometimes all, and sometimes none.

Like this:

https://i.stack.imgur.com/z2Azq.png

after pressing a new date on the site:

https://i.stack.imgur.com/BpZpD.png

I think it's because the site updates or loads new "instances" of the word. Is there any way to keep the script updating like every second? Replacing the word again.

Manifest:

{
"manifest_version": 2,
    "name": "title",
    "description": "description",
    "version": "4.0",
    "content_scripts": [
        {
            "matches": [
                "*://*/*"
            ],
            "js": [
                "content.js"
            ],
            "run_at": "document_idle"
        }
    ]
}

content.js

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(/Turkiet/g, 'found');

            if (replacedText !== text) {
                element.replaceChild(document.createTextNode(replacedText), node);
            }
        }
    }
}

Looping every second is a bad way to accomplish what you desire. If you are wanting to detect that additional elements have been added to the DOM, you should use a `MutationObserver`. The answers to [Is there a JavaScript/jQuery DOM change listener?](https://stackoverflow.com/a/39508954) have both a good discussion of MutationObservers and the other methodologies available to Chrome extensions. — Makyen, Jun 26 '17 at 05:25

score 0 · Accepted Answer · answered Jun 25 '17 at 19:35

0

Yes, just throw your code in to a function then use setInterval():

function replaceWord(){
  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(/Turkiet/g, 'found');

        if (replacedText !== text) {
            element.replaceChild(document.createTextNode(replacedText), 
            node);
        }
    }
 }
 }
}

//Calls replaceWord() every second
setInterval(replaceWord,1000);

answered Jun 25 '17 at 19:35

Nick Cordova

724
6
16

Thanks for your answer. It seems like it isn't working however. I also noticed I messed up my code, it's supposed to say "text.replace(/Turkiet/g, 'found')". – J doe Jun 25 '17 at 19:40
I had to change setInterval(replaceWord(),1000); to setInterval(replaceWord,1000); So I don't if that's it. setInterval(replaceWord(),1000) only gets call once. – Nick Cordova Jun 25 '17 at 19:43
Are you sure you want to run this code every second? Looping on *every element* in the page every second isn't really the best thing to do.. Here's a possibly better alternative instead: https://stackoverflow.com/q/3219758/314056 – Christian Jun 25 '17 at 19:52
1

@Christian, FYI: For Chrome extensions, a better MutationObserver dup-target is [Is there a JavaScript/jQuery DOM change listener?](https://stackoverflow.com/a/39508954), which has an answer which also discusses the additional methodologies available to Chrome extensions. – Makyen Jun 26 '17 at 05:20
@Makyen, cool.. I'm not very familiar with chrome apis, but looping on every dom element definitely sounded like a bad idea. – Christian Jun 26 '17 at 09:13
Thank you all for the tips with the loops, looping everything every second should be taxing on the computer I suppose. Now I'm trying to hide the divs that contain the desired words, any ideas? – J doe Jun 27 '17 at 00:19
Oh and also, I've managed to remove the first div which is the one saying "Antalyakusten found" in the first picture. How would I remove the parent div(s)? – J doe Jun 27 '17 at 00:27

Chrome Extension changes words irregularly

1 Answers1