如何遍歷DOM元素的內部子元素

我想檢查一個DOM元素是否包含某些元素。舉例來說，如果我有這樣的p元素：如何遍歷DOM元素的內部子元素

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"); 
 
}

<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>

但它只是提醒u元素。我不知道爲什麼它不搜索p元素的更深層的孩子。

來源

2017-09-27 Bold Fish 0246

一個技巧：使用'的console.log（...）'。好處是你不會受到UI停頓模式的影響，並且控制檯日誌將顯示對象的所有字段，其中警報將向您顯示'[Object object]'。 –

好的^^謝謝你的提示 –

-1

我想你在那裏。我只包含jquery腳本標籤，並使用長度函數來查看元素是否存在。

看到的片段：

$(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> 
 
\t <strike> 
 
\t <b>text</b> 
 
\t </strike> 
 
    </u> 
 
    </i> 
 
</p>

來源

2017-09-27 18:43:03 MUlferts

它的工作！謝謝sooo –

erm ..什麼？如果第一個工作，其他人會有。如果第一個工作正在進行，則在domready中進行包裝將不起作用。（無論原始代碼中是否存在這些元素，它們應該都可以工作） –

，不被你的代碼應該alert()上這些類型的所有它們是否存在與否，因爲find()總是返回一個對象，因此總是如此。

而應該檢查發現收集的length：

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 
 
}

<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>

來源

2017-09-27 18:47:05

如何遍歷DOM元素的內部子元素

回答

相關問題