我得到了一个遍历所有 HTML 子节点的递归函数。
是否有一种简单的方法来检查当前元素是否是具有 element.nodeType 的图像？所以我可以在这个元素上使用 DOM。
这里是代码示例:
`
replaceText(document.body)
function replaceText(element){
if(element.hasChildNodes()){
element.childNodes.forEach(replaceText)
} else if(element.nodeType === Text.TEXT_NODE){
//Do Something
}
`
就像这样，但也适用于图片，尤其是图片 alt 属性。
最佳答案
一旦确定它不是文本节点，只需使用元素的 nodeName 属性来检查它是否是图像(“IMG”)。
replaceText(document.body)
function replaceText(element){
if(element.hasChildNodes()){
element.childNodes.forEach(replaceText)
} else if(element.nodeType === Node.TEXT_NODE){
console.log("Text Found! textContent: ",element.textContent)
}
else if(element.nodeName = "IMG"){
console.log("Image Found! Alt: ",element.alt)
}
}<html>
<body>
<p>this is text</p>
<div>this is an element</div>
<img src="https://placehold.it/22" alt="i am an image">
</body>
</html>要获取图像的 alt 属性，只需在代码中使用 element.alt 即可。
要删除图像(如果图像中的文本与正则表达式匹配)，只需测试您想要测试的每个属性:
function replaceText(element){
if(element.hasChildNodes()){
element.childNodes.forEach(replaceText)
} else if(element.nodeType === Node.TEXT_NODE){
//console.log("Text Found! textContent: ",element.textContent)
}
else if(element.nodeName = "IMG"){
console.log("Image Found! Alt: ",element.alt)
let re = /Wendler/gi
if((element.alt != undefined &&element.alt.match(re)) || (element.src != undefined &&element.src.match(re)) || (element.title != undefined &&element.title.match(re))){
element.remove()
}
}
}<html>
<body>
<p>this is text</p>
<div>this is an element</div>
<img src="https://placehold.it/22" alt="i am an image">
<img src="https://placehold.it/25" alt="i am an image containing the word wendLer somewhere">
<img src="https://placehold.it/25?text=wendler" alt="i am an image">
<button onclick="replaceText(document.body)">Click to remove images</button>
</body>
</html>关于jquery - 检查节点类型的图片/Alt 属性，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/60356328/