Tru*_*gDQ 3 html javascript jquery text replace
我想用"@@@@"替换所有显示文本.这意味着用户将看到所有页面都充满了"@@@@"而不是文本(除了图像,iframe或页面的HTML代码中不存在某些内容).
这几乎取代了页面的html代码,但不影响标签和代码,只影响显示给用户的文本.
例如,我想替换此页面中的所有文本:
<!DOCTYPE html>
<html>
<body>
<ul class="topnav">
<li>Item 1</li>
<li>Item 2
<ul><li>Nested item 1</li><li>Nested item 2</li><li>Nested item 3</li></ul>
</li>
<li>Item 3</li>
</ul>
<div>DIV1</div>
<div>DIV2</div>
<span>SPAN</span>
<table>
<tr>
<td>Username</td>
</tr>
<tr>
<td>Password</td>
</tr>
</table>
<p>
<input type="checkbox" name="remember" tabindex=3 />
<label for="checkbox">Remember <strong>password</strong></label>
</p>
<p>Click here to <a href='register.php'>Register</a></p>
</body>
</html>
结果应该是:
<!DOCTYPE html>
<html>
<body>
<ul class="topnav">
<li>@@@@</li>
<li>@@@@
<ul><li>@@@@</li><li>@@@@</li><li>@@@@</li></ul>
</li>
<li>@@@@</li>
</ul>
<div>@@@@</div>
<div>@@@@</div>
<span>@@@@</span>
<table>
<tr>
<td>@@@@</td>
</tr>
<tr>
<td>@@@@</td>
</tr>
</table>
<p>
<input type="checkbox" name="remember" tabindex=3 />
<label for="checkbox">@@@@<strong>@@@@</strong></label>
</p>
<p>@@@@<a href='register.php'>@@@@</a></p>
</body>
</html>
有些人我曾经尝试过:
使用JQuery替换只包含纯文本的所有元素,标签(以及它的子元素),这在开始时工作正常:
<ul class="topnav">
<li>@@@@</li>
<li>@@@@
<ul><li>@@@@</li><li>@@@@</li><li>@@@@</li></ul>
</li>
<li>@@@@</li>
</ul>
<div>@@@@</div>
<div>@@@@</div>
<span>@@@@</span>
但最近我意识到,如果元素,标签有子,它会失败:
<p>
<input type="checkbox" name="remember" tabindex=3 />
<label for="checkbox">Remember <strong>password</strong></label>
</p>
<p>Click here to <a href='register.php'>Register</a></p>
所以我尝试了另一种方法,使用document.body.innerText来选择所有文本,但HTML格式丢失了.
我好累.有人能帮我吗？
非常感谢!
这段代码似乎对我有用:
$('*').contents().filter(function() {
return this.nodeType == Node.TEXT_NODE && this.nodeValue.trim() != '';
}).each(function() {
this.nodeValue = '@@@@';
});
基本上,它用每个文本节点替换内容@@@@.
有关演示,请参阅此处:http://jsfiddle.net/K8544/3/
| 归档时间： |
|
| 查看次数： |
1833 次 |
| 最近记录： |