Learning, sometimes encountered event.target, always do not understand why to use target, and then learn the next, probably understand what the event.target refers to what element, about the event and this content, next time:
First of all: Event.target points to the element in the area where the mouse clicked (assuming the Click event) when the event was executed. If an event-bound element has child elements inside it, then event.target points to the child element, and if not, event.target points to the element to which the event is bound. Look at the code:
<HTML><Head><title>Prac</title><MetaCharSet= "Utf-8"><styletype= "Text/css"> *{margin:0;padding:0;font-size:20px;}#div1{Background-color:LightBlue;Height:300px;}#p1{Background-color:Red;Height:100px;}#p2{Background-color:Pink;Height:100px;}</style><Scripttype= "Text/javascript">functionGeteventtrigger (event) {x=Event.target; Alert ("Event.target element ID:" + x.id+ ", Event Type:" +event.type "); }</Script></Head>
<Body><DivID= "Div1"onmousedown= "Geteventtrigger (event)"> <PID= "P1">I'm P1.</P> <PID= "P2">I'm p2.</P>Parent Block Div1 The rest of the section</Div></Body>
</HTML>
such as: to the parent block Div1 binding MouseDown event, call function Geteventtrigger, pop event.target element ID: and event Type, DIV1 inside add two sub-elements, p1 and P2, the remaining is not covered by DIV1 part;
The effect is as follows: When you press the mouse in the P1, pop-up P1 id;p2 the mouse, pop the P2 ID, when the mouse is pressed in Div1, the pop-up is the DIV1 ID;
It also validates the above conclusion: Event.target points to the element in the area where the mouse clicked (assuming the Click event) when the event was executed. If an event-bound element has child elements inside it, then event.target points to the child element, and if not, event.target points to the element to which the event is bound.
There is a link to the back and w3school explanation, the feeling is unclear, but the case is changed with his code, hey
The target event property returns the destination node of the event (the node that triggered the event), such as the element, document, or window that generated the event.
Http://www.w3school.com.cn/jsref/event_target.asp
Who is event.target pointing to?
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
