admin管理员组

文章数量:1404924

I have problem: I need to replace some word on page with needed html. For example:

t = $('body').html();
t = t.replace(/Myword/g, '<div></div>');
$('body').html(t);

It is working successfully. But... If body contains javascript tag - JS running again.

If I use document.body - it working

t = document.body.innerHTML;
t = t.replace(/Myword/g, '<div></div>');
document.body.innerHTML = t;

But I am interested in jQuery solution. Maybe you have it?

Thanks in advance

I have problem: I need to replace some word on page with needed html. For example:

t = $('body').html();
t = t.replace(/Myword/g, '<div></div>');
$('body').html(t);

It is working successfully. But... If body contains javascript tag - JS running again.

If I use document.body - it working

t = document.body.innerHTML;
t = t.replace(/Myword/g, '<div></div>');
document.body.innerHTML = t;

But I am interested in jQuery solution. Maybe you have it?

Thanks in advance

  • javascript
  • jquery
  • html
Share Improve this question edited Jan 4, 2014 at 8:08 user2672265 asked Jan 4, 2014 at 8:04 indapublicindapublic 2,32810 gold badges39 silver badges50 bronze badges 4
  • 5 instead of modifying the entire page html you need to target only those specific elements with the given text – Arun P Johny Commented Jan 4, 2014 at 8:06
  • @ArunPJohny Can you provide that with an example? – Jenson M John Commented Jan 4, 2014 at 8:10
  • please share your html sample and where the text can appear – Arun P Johny Commented Jan 4, 2014 at 8:21
  • @ArunPJohny It can be plain text. Something like '<div><form>...</form>...Many many text...<div>...</div>Myword</div> – indapublic Commented Jan 9, 2014 at 15:39
Add a ment  | 

4 Answers 4

Reset to default 3

A simple solution would be to ignore all the script tags.

t = $('body').clone().find("script").remove().end().html();
t = t.replace(/Myword/g, '<div></div>');
$('body').html(t);

Demo

This solution might help you.

JavaScript not executed if:

  1. JavaScript inside the <script type=”text/xml”> doesn’t execute
  2. JavaScript inside the <script type=”text/xml” type=”text/javascript”> doesn’t execute as well because only the first type is considered

so change type:

function preventJS(html) {
     return html.replace(/<script(?=(\s|>))/i, '<script type="text/xml" ');
}

and use it:

t = $('body').html();
t = t.replace(/Myword/g, '<div></div>');
$('body').html(preventJS(t));

As Arun mentioned in the ments, you should target the elements more specifically. It sounds like <script> tags will be re-evaluated if you use JQuery to get the entire <body> content and then re-insert it. Try wrapping the desired content in a <div>:

<body>
    <div id="wrapper">
        <p>Text that will be altered</p>
    </div>
    <script type="text/javascript">
        //javascript code
    </script>
</body>

Then your code that will replace text can be:

t = $('#wrapper').html();
t = t.replace(/Myword/g, '<div></div>');
$('#wrapper').html(t);

A better way would be to just replace "Myword" in the most specific element possible. This will only replace Myword in the textNodes which contain it and nowhere else.

var each = Array.prototype.forEach;

var $myword = $(":contains('Myword')");
$myword.each(function() {
    each.call(this.childNodes, function(ele) {
        if(ele.nodeType === 3 && ele.nodeValue.indexOf('Myword') >= 0) {//if ele is a text node and contains myword
            ele.nodeValue = ele.nodeValue.replace(/Myword/g, "some text");
        } 
    }, this);
});

Try running it on this page

本文标签： jqueryReplace html part by javascriptStack Overflow

版权声明：本文标题：jquery - Replace html part by javascript - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1744864236a2629253.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。