Javascript / Jquery+ Replace single and double quotes in a inner html content

Question

Let's say I have a DIV as below.

<div id="mydiv">
    <p class="abc">some text here</p>
    <p class="xyz"><img src="img.jpg" title="my img"/> some "double quoted text" here</p>
</div>

I read the inner html of the div.

var originalcontent = $("mydiv").html();

Now I need to replace double quotes for the texts only but not for the tag attributes. So my output should be as below.

var myoutput = '<p class="abc">some text here</p><p class="xyz"><img src="img.jpg" title="my img"/> some &quot;double quoted text&quot; here</p>'

Can you suggest me a solution please. Thank you!

Keep using the DOM. Grab the `children` then do what you need to do with the `textContent`. — elclanrs, Dec 26 '13 at 04:27
possible duplicate of [How do I select text nodes with jQuery?](http://stackoverflow.com/questions/298750/how-do-i-select-text-nodes-with-jquery) — Barmar, Dec 26 '13 at 04:28

display-name-is-missing · Answer 1 · 2013-12-26T05:01:13.240

3

Try this:

function replace_text(node){ 
  node = node || document.getElementById('mydiv'); // Change 'mydiv' if you need 

  var children = node.childNodes;
  var i = 0;

  while(node = children[i]){ // While-loop

    if (node.nodeType == 3){ // Some text, replace
        if (node.textContent) { // Not IE (IE's equivalent to textContent is nodeValue)
            node.textContent = node.textContent.replace(/"/g, '&quot;');
        }
        else { // IE
            node.nodeValue = node.nodeValue.replace(/"/g, '&quot;');
        }
    } else { // not text, take step further
      replace_text(node); 
    } 
    i++; 
  } 

} // While-loop


// Don't forget to call function
replace_text();

edited Dec 26 '13 at 05:01

answered Dec 26 '13 at 04:33

display-name-is-missing

4,424
5
28
41

@aliasm2k Why this necessity to use jQuery? – display-name-is-missing Dec 26 '13 at 04:47
The question mentioned js/jquery. Personally I'd prefer core js than jquery. Except incase of effects. – Dec 26 '13 at 04:55
@aliasm2k Well, maybe a jQuery-solution might be more cross-browser. My solution have that too, though (haven't checked in really old IE's and such though). Other than that, do you believe a pure js-solution could be slower? I doubt so. – display-name-is-missing Dec 26 '13 at 05:02
In this case pure js is really enough. – Dec 26 '13 at 05:23

score 0 · Answer 2 · answered Dec 26 '13 at 04:52

With Jquery You can do this :

    String.prototype.replaceAll = function(stringToFind,stringToReplace){
    var temp = this;
    var index = temp.indexOf(stringToFind);
        while(index != -1){
            temp = temp.replace(stringToFind,stringToReplace);
            index = temp.indexOf(stringToFind);
        }
        return temp;
   };
    $(function(){                     

            $("#mydiv").children().each(function(){
                 var text=$(this).text(); 
                 text=text.replaceAll("\"","&quot;"); 
                 //alert(text);
                 $(this).text(text); 
             });
    });

Javascript / Jquery+ Replace single and double quotes in a inner html content

2 Answers2