function htmlreplace(a, b, element) { if (!element) element = document.body; var nodes = element.childNodes; for (var n=0; n<nodes.length; n++) { // MSIE doesn't have Node if (nodes[n].nodeType == 3) { var r = new RegExp(a, 'gi'); // MSIE8 and less doesn't have textContent if (nodes[n].textContent) { // If we assign try and assign a new value to // nodes[n].textContent // then 2011 bulds of MSIE9 crash with "A problem with this // website caused Internet Explorer to close" // (later builds are OK). // To be safe, assign to nodes[n].nodeValue instead. //nodes[n].textContent = nodes[n].textContent.replace(pattern, replacement); nodes[n].nodeValue = nodes[n].textContent.replace(r, b); } else { nodes[n].nodeValue = nodes[n].nodeValue.replace(r,b); } } else { htmlreplace(a, b, nodes[n]); } } } $(document).ready(function() { var m = $("meta[name=keywords]"); var ArrayData = m.attr("content").split(','); $.each(ArrayData, function(index, value) { var id = index; var regex = new RegExp(value, 'g'); htmlreplace(value,'<em class="tipp_'+id+'" style="float:none;clear:none;position:relative;"><a href="#" class="tooltips_'+id+'" image_id="'+id+'" style="float:none;clear:none;" title="Finally Testing this out right now. Look at it scrol. This is a infolink box so that the content of the infolink is scrollable we are making sure of that right now. 100% check it out right now thats for sure keyword: '+value+'">'+value+'</a></em>'); }); }); PHP: See the example... http://clickadx.com/infolink/infolink1.php what I need to happen is have the html that is rendering in plan text to be rendered in html.
"plan text"?!? Do you mean plain? Not sure what you're even trying to do with that -- it SEEMS needlessly complex/convoluted; I'll study it more, but a bit of explanation of what it is you are trying to accomplish would go a long ways. It ALMOST sounds like a job for innerHTML and/or outerHTML.
Its a piece of coding for a tooltip feature that allows it to be placed on any website out there. So whats happens there is I fetch keywords, then turn then into an array, and find and replace the keywords in any given website and replace them with a link that gives a tooltip popup.. Finds the keywords words automatically.
Ok, my bad -- what you are trying to do needs to be MORE complex :/ Really splitting the innerText/textContent and other such methods is wrought with problems -- like inline-level element nodes being kin to textnodes, etc, etc... you need to walk the child DOM of the element -- simply passing through it's top level childer as an array isn't gonna fly. You also will want to hit any children of the children and so on and so forth... and that means a DOM walker. You're in luck, i have a trick for doing that. var e=target.firstChild, next; while (e) { next = ( e.tagName && (doNotParse.indexOf(e.tagName)>=0) ? e.nextSibling : e.firstChild || e.nextSibling ) || ( e.parentNode == node ? null : e.parentNode.nextSibling ); // process e here e=next; } Code (markup): I store the next element BEFORE processing because in this case, you would actually be removing e from the parent, estranging it. You do e.parentNode.removeChild(e), it's hard to find the next one. In terms of replacing it, I'd make the master elements of the EM around the word and a span for it's hover state text be hard-coded into the replacement. You 'need' an element to put in the markup other than a textnode -- so lets emphasize the word and give it a class, and make the 'hover' text be a span. Plugging the word into that span I would just use a hardwired "%1" replace. Processing the textnodes is also tricky as you'd need to split them by their whitespace... You also need to detect the word and not any punctuation around it -- which I'd handle with a second split... this ends up being a LOT of regex so on really large pages this could be painfully slow -- why I'd handle this server side instead of scripting... but you're asking for client side, so pressing on... I'd probably include non-word characters in the EM though -- processing/collapsing a wordlist .... appendChild, createTextNodes... ... and would STILL have to use innerHTML for the content if you want to use markup in the tooltips. Ok, here's what I come up with: http://www.cutcodedown.com/for_others/dangy/ That about what you're asking for? I added multiple ways of passing hooks to it, and the ability to manually add different responses to each keyword index if desired.
Thanks for the fast reply but I already figured it out.. But great answer but my answer was even more complex then that.