Question

我正在尝试检查DOM元素是否包含某些元素。例如，如果我有这个p元素：

＆＃13;

if ($("#parent").find("U")) {
  alert("found u");
}
if ($("#parent").find("B")) {
  alert("found b");
}
if ($("#parent").find("STRIKE")) {
  alert("found strike");
}
if ($("#parent").find("I")) {
  alert("found i");
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p id="parent">
  <i>
     <u>
      <strike>
        <b>text</b>
      </strike>
     </u>
    </i>
</p>

＆＃13;

但它仅警告u元素。我不知道为什么它没有搜索p元素的更深层次的孩子。

Answer 1

按原样，您的代码应alert()在所有这些类型上，无论它们是否存在，因为find()始终返回一个对象，因此始终为true

您应该检查找到的集合的length：

＆＃13;

var p = $("#parent")

if (p.find("U").length) {
  console.log("found u");
}
if (p.find("B").length) {
  console.log("found b");
}
if (p.find("STRIKE").length) {
  console.log("found strike");
}
if (p.find("I").length) {
  console.log("found i");
}
if (p.find("div").length) {
  console.log("found div");    // shouldn't see this
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p id="parent">
  <i>
    <u>
      <strike>
        <b>text</b>
      </strike>
    </u>
  </i>
</p>

＆＃13;

Answer 2

我认为你在那里。我只是包含了jquery脚本标记，并使用length函数来查看元素是否存在。

请参阅代码段：

$(function() {
  if ($("#parent").find("U").length) {
    alert("found u");
  }
  if ($("#parent").find("B").length) {
    alert("found b");
  }
  if ($("#parent").find("STRIKE").length) {
    alert("found strike");
  }
  if ($("#parent").find("I").length) {
    alert("found i");
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<p id="parent">
  <i>
   <u>
	<strike>
	  <b>text</b>
	</strike>
   </u>
  </i>
</p>

如何遍历DOM元素的内部子元素

2 个答案: