Javascript 使用jquery遍历$（“body”部分标记除外

我正在遍历一个页面，使用jquery将

添加到我的电话号码的特定正则表达式模式中。我正在使用

$（“body:first”）.html（）成功地遍历页面，但是，我想排除一些标记，例如：
，因为如果它们与我的正则表达式中的特定模式匹配，它们往往会破坏页面

我试过：
$（“body:first”）.not（“script”）.not（“img”）.html（）没有成功。我遇到了一些我不感兴趣的内容。我有什么遗漏吗？我注销我的帐户

是否仍然可以使用.not（）链接这些的倍数

您的代码应该可以工作，尽管您不想只获取body，但您需要body中的所有元素

请尝试以下操作：


var-elements=$（'body*'）。not（'script'）。not（'span'）。get（0）；
控制台日志（元素）

并让它与您的正则表达式一起工作，并替换每个适用的文本节点

const phoneRegex = /555-555-5555/
const phoneMarkup = "<a href=\"tel:$&\">$&</a>"
const hyperlink = text => text.replace(phoneRegex, phoneMarkup)

$("body :not(:empty):not(script):not(img):not(svg)")
  .contents()
  .each(function() {
    if (3 !== this.nodeType) return
    const text = this.textContent
    if (!text) return
    const markup = hyperlink(text)
    if (markup === text) return
    $(this).replaceWith(markup)
  })

constphoneregex=/555-555-5555/
const phoneMarkup=“”
const hyperlink=text=>text.replace（phoneRegex，phoneMarkup）
$（“正文：非（：空）：非（脚本）：非（img）：非（svg）”）
.contents（）
.each（函数（{
如果（3！==this.nodeType）返回
const text=this.textContent
如果（！text）返回
常量标记=超链接（文本）
如果（标记===文本）返回
$（此）.replaceWith（标记）
})


通过链接选择或通过带逗号的jQuery选择

$（“正文：非（：空）：非（脚本）：非（img）：非（svg）”）
$（“正文：非（：空）”）.not（“脚本、img、svg”）

迭代
跳过非文本节点
通过
跳过空节点
使用正则表达式替换超链接文本
避免过度的DOM操作
通过替换文本节点

在所有HTML内容上使用regex替换不是最好的主意，而且使用jQuery遍历所有潜在候选节点的成本可能相当高。就我理解你的问题而言，你只想在DOM textNodes中替换电话号码——在这种情况下，所有现代浏览器都有一个本机的、性能良好的
TreeWalker
——你可以将其配置为只遍历textNodes，并使用过滤方法进行一些额外的微调

在您的情况下，这意味着获取不在
script
、
style
和
svg
标记中的所有文本节点。另外，
a
标记应被忽略，因为嵌套的锚无效。首先，我们必须收集所有匹配的textNode，然后用regex替换它们的parentNode的内容

在我的示例中，我使用了匹配的textNode的
.innerHTML
（不安全）和
.replacetwith
，但如果操作正确，我们应该以一种方式更改正则表达式，即我们可以使用
while（regex.exec（text））
来迭代匹配项，并将textNodes以及锚定标记附加到其父节点（将其内容重置为空后）


var phoneRegex=/（\b）（（\+？[？]？1？\（？）（[\s]？[\s-]？[\s]？[\s]）（\（？[2-9]\d{2}\）（[\s]？[\s-]？[\s.]？[\s]）（[2-9]\d{2}？（[\s]？[\s-]？[\s]？[\s]）（\d{4}）/，
//这些节点类型可以有TextNode子节点，但我们会将它们过滤掉
excludeNodes=[“脚本”、“样式”、“SVG”、“A']，
//创建本机treeWalker实例，仅查找文本节点
//但忽略excludeNodes中的节点类型和
//与您的正则表达式不匹配
treeWalker=document.createTreeWalker（document.body，NodeFilter.SHOW_TEXT{
acceptNode:函数（节点）{
if（excludeNodes.indexOf（node.parentNode.nodeName.toUpperCase（））>-1
||！phoneRegex.test（node.data））返回NodeFilter.FILTER\u拒绝
返回NodeFilter.FILTER\u接受；
}
}),
textNodes=[]；
//收集所有匹配的文本节点（我们无法实时替换
//节点，否则treewalker将中断）
while（treeWalker.nextNode（））textNodes.push（treeWalker.currentNode）；
//如果所有匹配的文本节点与phone regex匹配，则用span替换它们
//并将电话号码替换为“）；
textNode.replaceWith（newNode）；
})；
1-888-452-1505

1（408）5625504


1.408.562.5504

1-613-3568772

（1） 9543615599

1.954.361.5599

+1.954.361.5599

954.361.5599

+1954361-5599

（954）361-5599

（954）361-5599

9543615599

（954）3615599

+19543615599

1-954-361-5599

+1-954-361-5599

954361-5599

前缀文本+1-954-361-5599

+1-954-361-5599发布文本

嵌套项

954361-5599

（954）3615599

日志（“请忽略我（954）3615599”）
一些svg数据，忽略电话号码，如+1-954-361-5599等。
更简单的方法是将要忽略的标记存储在一个数组中，并用于获取其内容的逗号分隔值。由于支持传递多个以逗号分隔的选择器，因此这将根据需要工作

另外，请确保使用
body*
选择器选择body的所有子体，因为当前使用的子体仅选择
body
元素

获取所有所需的元素后，您可以对它们进行迭代，并在每个元素上执行正则表达式，并在替换相应的部分后使用它们更新它们

示例：


/*----JavaScript---*/
常量正则表达式=/（\b）（\+？[？]？1？\（？）（[\s]？[\s.]？[\s]？[\s]）（\（？[2-9]\d{2}\）（[\s]？[\s-]？[\s.]？[\s]？[\s]）（[2-9]\d{2}？（[\s]？[\s-]？[\s.]s][\s]）（\d{4}）（\b）/；
const ignoredTags=[“脚本”、“svg”、“img”]；
const wantedElements=$（“body*”）.not（ignoredTags.toString（））；
wantedElements.每个（函数（索引，元素）{
element.innerHTML=element.textContent.replace（regex，“”）；
})；