Javascript 您可以使用 event.target 定位元素的父元素吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29168719/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Can you target an elements parent element using event.target?
提问by Adam
I am trying to change the innerHTML of my page to become the innerHTML of the element I click on, the only problem is that i want it to take the whole element such as:
我正在尝试将页面的innerHTML 更改为我单击的元素的innerHTML，唯一的问题是我希望它采用整个元素，例如：
<section class="homeItem" data-detail="{"ID":"8","Name":"MacBook Air","Description":"2015 MacBook A…"20","Price":"899","Photo":"Images/Products/macbookAir.png"}"></section>
Whereas the code that i have written in javascript:
而我用javascript编写的代码：
function selectedProduct(event){
target = event.target;
element = document.getElementById("test");
element.innerHTML = target.innerHTML;
}
will target the specific element that i click on.
将针对我点击的特定元素。
What i would like to achieve is when i click on anywhere in the <section>element, that it will take the innerHTML of the whole element rather than the specific one that i have clicked.
我想要实现的是当我点击<section>元素中的任何地方时，它将采用整个元素的innerHTML，而不是我点击的特定元素。
I would presume it is something to do with selecting the parent element of the one that is clicked but i am not sure and can't find anything online.
我认为这与选择被点击的元素的父元素有关，但我不确定并且在网上找不到任何东西。
If possible i would like to stay away from JQuery
如果可能的话，我想远离 JQuery
回答by donnywals
I think what you need is to use the event.currentTarget. This will contain the element that actually has the event listener. So if the whole <section>has the eventlistener event.targetwill be the clicked element, the <section>will be in event.currentTarget.
我认为您需要的是使用event.currentTarget. 这将包含实际具有事件侦听器的元素。因此，如果整个<section>事件侦听器event.target将是单击的元素，<section>则将在event.currentTarget.
Otherwise parentNodemight be what you're looking for.
否则parentNode可能就是你要找的。
回答by KJ Price
To use the parent of an element use parentElement:
要使用元素的父元素，请使用parentElement：
function selectedProduct(event){
var target = event.target;
var parent = target.parentElement;//parent of "target"
}
回答by Abdul Alim
function getParent(event)
{
return event.target.parentNode;
}
Examples:1.
document.body.addEventListener("click", getParent, false);returns the parent element of the current element that you have clicked.
- If you want to use inside any function then pass your event and call the function like this :
function yourFunction(event){ var parentElement = getParent(event); }
示例：1.
document.body.addEventListener("click", getParent, false);返回您单击的当前元素的父元素。
- 如果你想在任何函数内部使用，那么传递你的事件并像这样调用函数：
function yourFunction(event){ var parentElement = getParent(event); }
回答by David
handleEvent(e) {
const parent = e.currentTarget.parentNode;
}
回答by Shubham Rungta
$(document).on("click", function(event){
var a = $(event.target).parents();
var flaghide = true;
a.each(function(index, val){
if(val == $(container)[0]){
flaghide = false;
}
});
if(flaghide == true){
//required code
}
})
回答by Vanga Kiran Kumar Reddy
var _RemoveBtn = document.getElementsByClassName("remove");
for(var i=0 ; i<_RemoveBtn.length ; i++){
_RemoveBtn[i].addEventListener('click',sample,false);
}
function sample(event){
console.log(event.currentTarget.parentNode);
}
