javascript - 使用 jQuery 有选择地用 HTML 替换文本

标签 javascript jquery html replace

如何使用 jQuery 替换页面上的文本而不替换标签和标签内的文本,例如:<a>,<input>,<button>,<textarea>,<input>,<select> .

例如,这里是HTML代码

<html>
<head>
    <title>Testing</title>
</head>
<body>
    Hello, this is a test replacing {REPLACE_ME} with <b>{REPLACED}</b>.
    <br/><br/>
    I want {REPLACE_ME} and {REPLACE_ME} to be <b>{REPLACED}</b>, however I don't want this <a href="#">{REPLACE_ME}</a> to become <a href="#">{REPLACED}</a>.
    Same with <textarea>{REPLACE_ME}</textarea>, it shouldn't change.
    <br/><br/>
</body>

我有这个 jQuery 来替换文本

var replaced = $("body").html().replace(/{REPLACE_ME}/gi,'<b>{REPLACED}</b>');
 $("body").html(replaced);

在 JSFiddle 上

http://jsfiddle.net/E8ZPY/

最佳答案

$('body, body *:not(a,button,textarea,option)').contents().filter(function() {
    return this.nodeType === 3;
}).each(function() {
    var escaped = $('<div></div>').text($(this).text()).html();
    $(this).replaceWith(escaped.replace(/\{REPLACE_ME\}/gi,'<b>{REPLACED}</b>'));
});

JSFiddle

(我不需要包含input,并且我使用了option而不是select,因为option 是带有 child 文本节点的节点。)

关于javascript - 使用 jQuery 有选择地用 HTML 替换文本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20535924/

相关文章:

javascript - 有向无环词图(dawg)的空间效率是多少?是否有 javascript 实现?

JavaScript - 如何从对象中排除元素?

javascript - IE8不会运行特定的JS函数,但会运行具有类似代码的另一个函数

jquery - 如何使用 jquery 查找从子级到父级的元素计数?

javascript - Qt访问Websql数据库

javascript - 在 Firefox 上捕获按键事件中的 CTRL+

css - 如何将 5 个带边框的 div 恰好放在包含带边框的 div 中

java - 将 HTML 内容添加到与 JTextPane 关联的文档

Javascript复杂数组 "element reduction"- 基于数组元素构建HTML表格

javascript - tr 上的边框颜色不适用于 IE-7