jQuery | event.target Property with Example
The event.target is an inbuilt property in jQuery which is used to find which DOM element will start the event.
Syntax:
event.target
Parameter: It does not accept any parameter because it is a property not a function.
Return Value: It returns which DOM element triggered the event.
jQuery code to show the working of event.target Property property:
< html > < head > < style > span, strong, p { padding: 8px; display: block; border: 2px solid green; width: 50%; margin: 10px; } #output { margin: 10px; padding: 10px; width: 100px; border: 2px solid green; display: block; } </ style > </ script > </ head > < body > < div > < p > < strong >< span >click Here !</ span ></ strong > </ p > </ div > <!-- output will show inside this block --> < div id = "output" ></ div > <!-- jQuery code to show working of this property --> < script > $("body").click(function(event) { $("#output").html("clicked: " + event.target.nodeName); }); </ script > </ body > </ html > |
Output:
Before clicking anywhere-
After clicking inside of the p element-
After clicking inside of the STRONG element-
After clicking inside of the SPAN element-