我正在构建一个Chrome扩展程序,该扩展程序可以解析整个DOM/HTML,并将
找到的任何电子邮件(多封电子邮件)替换为以下div:
<div class="email_tmp"> found_email <span>SAVE EMAIL</span></div>
例:
<body>
<div>Some Text...</div>
<div>text a@a.com text</div>
<div>Some Text...</div>
<p>More Text</p>
<div><div><span>text b@b.com text</span></div></div>
<span>Last text</span>
</body>
替换为:
<body>
<div>Some Text...</div>
<div>text <div class="email_tmp"> a@a.com <span>SAVE EMAIL</span></div> text</div>
<div>Some Text...</div>
<p>More Text</p>
<div><div><span>text <div class="email_tmp"> b@b.com <span>SAVE EMAIL</span></div> text</span></div></div>
<span>Last text</span>
</body>
如何搜索和替换找到的电子邮件由整个div和
字符串found_email由
电子邮件?我只想替换找到的电子邮件字符串,仅此而已...
我真的很感激任何帮助。
这是您寻找的整体解决方案
.HTML
<div id="main">
sdfsdsdfsdfsdf a@a.com sdfsdfsdfsdfsdfsdf
</div>
JavaScript
var page_content = document.getElementById('main').innerHTML;
var found_email = "<div class='email_tmp'> found_email <span>SAVE EMAIL</span></div>";
//gives an array of the emails
var email = page_content.match(/([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+.[a-zA-Z0-9._-]+)/gi);
//replaces the emails to your desired content
var result = page_content.replace(email, found_email);
//replaces the changed HTML back to the 'main' div
document.getElementById('main').innerHTML = result;
这是小提琴
更新:
如果您只想替换文本而不向 HTML 的内容添加任何类或标签,那么为相同的内容编写一个普通脚本会变得非常复杂。在这种情况下,我强烈建议您使用这个库,我发现它是解决您问题的完美解决方案。
它是一个名为findAndReplaceDOMText
的库,它使用内置方法来解决问题。你只需要像这样给出find
(要查找的内容)和replace
(替换 HTML),
findAndReplaceDOMText(document.getElementById('t'), {
find: /([a-zA-Z0-9._-]+@[a-zA-Z0-9._-]+.[a-zA-Z0-9._-]+)/gi,
replace: '<div class='email_tmp'> found_email <span>SAVE EMAIL</span></div>'
});
如果您在实现此库时遇到任何问题,显然可以恢复。
这也是一篇必读的文章 - 替换文本在 dom-解决
对@NikhilNanjappa的原始答案略有更新:我的版本效率较低,但它会保留实际的电子邮件地址并在div 前面加上div 并附加跨度和结束标签,基于原始答案。
var save_email_beg = "<div class='email_tmp'> ";
var save_email_end = " <span>SAVE EMAIL</span></div>";
var i = 0;
for (; i < email.length; i++) {
var new_string = save_email_beg + email[i] + save_email_end;
page_content = page_content.replace(email[i], new_string);
}
document.getElementById('main').innerHTML = page_content;