js測試被點擊的元素是子/子代

我想測試點擊是否在特定層次結構中的元素上。js測試被點擊的元素是子/子代

使用：

var elements = parentElement.getElementsByTagName("*");

我可以把所有的元素到數組，但我不能得到正確的測試：

function isClicked(e){ 
    if(elements.indexOf(e.target) != -1){ 
     //do something 
    } 
};

如何正確地做到這一點，好嗎？謝謝...

（PS我想創建一個點擊播放功能，其中在東西在體內除了點擊所顯示的信息將其關閉）

來源

2017-07-20 Gulli

使用Node.prototype.contains：

var button = document.querySelector('button'); 
 
var dialog = document.querySelector('.dialog'); 
 

 
button.addEventListener('click', function() { 
 
    dialog.classList.add('open'); 
 
}); 
 

 
document.body.addEventListener('click', function (e) { 
 
    if (button !== e.target && dialog !== e.target && !dialog.contains(e.target)) { 
 
    dialog.classList.remove('open'); 
 
    } 
 
});

.dialog:not(.open) { 
 
    display: none; 
 
} 
 

 
.dialog { 
 
    background-color: yellow; 
 
} 
 

 
span { 
 
    color: red; 
 
}

<button>Open dialog</button> 
 
<div class="dialog"> 
 
    <h1>Hello, World!</h1> 
 
    <p>Hello, World! <span>Nested element<span></p> 
 
</div> 
 

 
<p>Click somewhere here to close the dialog! <span>Nested element</span></p>

來源

2017-07-20 12:45:56 PeterMader

<<！dialog.contains（e.target）>>這是我所需要的一切，以使其正確工作...結果比我更容易，甚至不需要創建一個數組 - 甚至 - ！ – Gulli

不客氣。 – PeterMader

你可以使用下劃線的包含功能。所以，你的情況應該是在這種情況下：

if (_.contains(elements, e)) { 
    // ... 
}

來源

2017-07-20 12:29:15

嘗試以下操作：

function isClicked(e){ 
    //check e.currentTarget.children() 
};

來源

2017-07-20 12:31:21

既然做了'Node'時有一個「兒童」方法？ – PeterMader

js測試被點擊的元素是子/子代

回答

相關問題