JAVASCRIPT, How to create new div on statement line dynamic webpage?

Question

How to create new div on statement line dynamic webpage ?

Example

i want to create new div cover ADP

this image http://postimg.org/image/sqmn34c9t/

I'm doing ChromeExtension. This app about Stock Market Indexes, Ability of app is find word on webpage. If word is symbol of Indexes. This app will show information of indexes when mouse hover on word.

Now , i stored word about indexes be array

Example

var text = new Array("ADDYY","NKE","BUD");

and i find a word by

while ( (node = nodeIterator.nextNode()) ) {
        for (var i = 0; i <= 10; i++) {
            node.data = node.data.replace(text[i],temptxt );
        }

}

and Now i have a solution about addition div tag on webpage .

this js file

injectedCode.js

var ignoreTags = ["NOSCRIPT","SCRIPT","STYLE"];
var nodeIterator = document.createNodeIterator(document,NodeFilter.SHOW_TEXT,
    function (node){
          var parentTag = node.parentNode.tagName.toUpperCase();
          if ( ignoreTags.indexOf(parentTag)==-1 ) {return true} else {return false};
           },
    false
);

var node;
var div = document.createElement('div');
div.id ='popup';
div.innerHTML = "Hello";
var temptxt = document.getElementsByTagName('body')[0].appendChild(div);
var text = new Array("ADDYY","NKE","BUD");
while ( (node = nodeIterator.nextNode()) ) {
    for (var i = 0; i <= 10; i++) {
            node.data = node.data.replace(text[i],temptxt );
 }

}

Now, on webpage i get result : " [object HTMLDivElement] " on word

And ,This all my code https://github.com/DevNewbie93/replacesymbol

Thank you Anyone who advises and sorry if i did something wrong.

What the heck is a DIV cover? Cover to word?? Can you make yourself any less clear? — devnull69, Jun 05 '14 at 06:38
Placing a block level element inside an inline element is not recommended. — devnull69, Jun 05 '14 at 08:14
i just want to add div on clientserver when user click chrome extension of me — NewbieDev, Jun 05 '14 at 08:22
You've been question-banned. Let me explain why, and what you should do about it. It means that the questions you have posted so far are _low quality_ and/or _not suitable for StackOverflow_. And not just one, but most of your questions (apparently, deleted since then). Please take time to thoroughly read what is [considered on-topic](http://stackoverflow.com/help/on-topic), and [How to Ask](http://stackoverflow.com/help/how-to-ask). The last one is **critically important**. Show that you understand it by editing this question accordingly. — Xan, Jun 05 '14 at 11:31

score 0 · Accepted Answer · edited May 23 '17 at 11:49

The error you are getting

In your function here:

while ( (node = nodeIterator.nextNode()) ) {
  for (var i = 0; i <= 10; i++) {
    node.data = node.data.replace(text[i],temptxt );
  }
}

node is some DOM node, more specifically a Text node. Its data attribute it a String. When calling replace, it finds matches to the first argument and replaces them with second argument. From replace documentation: Second argument is expected to be a String, or a function that will return a String.

In your case, temptxt is NOT a string, but a DOM element. When you try to pass it as string, its .toString() method is called and returns "[object HTMLDivElement]".

Your actual question

It took some work to understand what you're trying to do. But it can be formulated as follows:

"How can I find all occurrences of a word in a document and replace them with another element?"

It's a non-trivial question. A good overview (and an implementation) is available, for instance, here.

Your solution will not work, since you're editing a Text node and it cannot contain any mark-up.

This answer is also a good source of information.

Remark: your question is astonishingly hard to understand. Since you are question-banned, it must've been a problem for some time. I realize that English is probably not your native language; you could look for programming resources in your native language and it might serve you better. In any case, pay more attention to your English when trying to ask for help, or it ends up being unintelligible. I was only able to infer what you're trying to do from the code. — Xan, Jun 05 '14 at 14:16
if i don't use replace function. How dom return to div on element? — NewbieDev, Jun 06 '14 at 05:57

JAVASCRIPT, How to create new div on statement line dynamic webpage?

1 Answers1

The error you are getting

Your actual question