Issue
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:
<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:
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.
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
Solution
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.target
will be the clicked element, the <section>
will be in event.currentTarget
.
Otherwise parentNode
might be what you're looking for.
link to currentTarget
link to parentNode
Answered By - donnywals
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.