使用 javascript 检查元素是否包含子标记而不是文本

Check if element contains child tag not text using javascript

本文关键字：文本 检查 javascript 元素 是否 包含 使用      更新时间：2023-09-26

示例 HTML：

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero.</p>
<p><img src="..." alt=""/></p>
<p><iframe width="" height="" src="...">....</iframe></p>
<p> Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam nec ante. Sed lacinia, urn</p>

如果可能的话，我怎样才能有效地获得那些包含标签而不是纯 javascript 的文本的 p 标签？

结果应为：

<p><img src="..." alt=""/></p>
<p><iframe width="" height="" src="...">....</iframe></p>

我已经这样接近它：

var ptags = document.querySelectorAll(".container p");
for(var i = 0; i<ptags.length; i++) { 
 if(ptags[i].querySelectorAll("img, iframe").length > 0) { .... }
}

假设您正在使用实际的 HTML 内容，您可以使用 document.querySelectorAll() 函数抓取所有段落，然后使用 filter() 函数过滤掉不包含任何子元素的段落：

// Grab an array of all of your <p> elements
var paragraphs = Array.prototype.slice.call(document.querySelectorAll('p'), 0);
// Filter out those paragraphs that do not contain any elements
paragraphs = paragraphs.filter(function(p){ return p.childElementCount > 0; });

根据您的编辑，您可以简单地检查循环中每个元素的 childElementCount 属性：

for(var i = 0; i < ptags.length; i++) { 
   // Check if this element has children
   if(ptags[i].childElementCount > 0) { 
       // This has children, do something
   }
}
相关文章：