我想檢查元素是否不直接在div之內。javascript [No Jquery]檢查元素是否在div內
例如，考慮follwing markup-
如果我把一個div內的另一個div。
然後，我可以用這個代碼 -
if(document.getElementById('innerDiv').parentElement.id == 'outerDiv'))
其中innerdiv是outerdiv內。
但是，如果我把四個div's放在另一個裏面，那我該如何檢查任何div是否在給定的div內。
有可能會比使用此代碼
innerelem.parentnode.parentnode.parentnode.parentnode
我希望我能解釋我想要做一個更好的選擇????
有可能會比使用此代碼
一個更好的選擇幾個選項：
如果你真的有id S（或其他任何東西，你可以用它來唯一標識內部元素內部的一個），那麼你可以使用querySelector：
if (document.getElementById("outerDiv").querySelector("#innerDiv")) {
// Yes, it's inside it
} else {
// No, it isn't
}
querySelector返回null如果它沒有找到該元素，並且當您在元素上使用它時，它只會在該元素的後代（而不是整個文檔）內查找。所有現代瀏覽器和IE8都支持querySelector。
如果您需要更多的靈活性，循環將比.parentNode.parentNode...少脆：
var node, inside;
inside = false;
for (node = innerelem; node; node = node.parentNode) {
if (node.id === 'outerDiv') {
inside = true;
break;
}
}
<html>
<body>
<div id="oInput">
<input id="1" type="text">
<input id="2" type="text">
<input id="3" type="text">
<input id="4" type="text">
<input id="5" type="text">
</div>
<script type="text/javascript">
var oInput = document.getElementById('oInput'), oChild;
for(i = 0; i < oInput.childNodes.length; i++){
oChild = oInput.childNodes[i];
if(oChild.id== 'your id'){
alert('it is child');
}
}
</script>
</body>
</html>
您可以創建這樣一個功能：
function findUpId(innerId, outerId) {
var el = document.getElementById(innerId);
while (el.parentNode) {
el = el.parentNode;
if (el.id === outerId)
return true;
}
return false;
}
你可以然後致電：
var inside = findUpId("innerDiv","outerDiv");
參照https://stackoverflow.com/a/2631931/3940047並找到方法getPathTo（元素）
您可以執行讓你所指的元素的XPath的。如果您的元素位於給定的div ID中，您可以檢查xpath。
您可以使用Node.containshttps://developer.mozilla.org/en-US/docs/Web/API/Node.contains：
if(document.getElementById('outerDiv').contains(document.getElementById('innerDiv')))
可能得到的容器div的內部HTML和正則表達式測試爲'ID ='innerDiv''的occurances？ – Banana
如果你使用你剛纔提到的1個選項，那麼有多少'div'並不重要，它可以工作。 – P5Coder