I was searching for this for very long and didn’t really found something useful unless using a\u00a0JavaScript\u00a0framework, but for those who want to learn to code from scratch this is the answer.<\/p>\n
First you have to get the element that triggers an event. example:<\/p>\n
In the HTML page header add the Every DOM event carry out the event information, you only has to targeted, and of course all mayor browser do it differently so you need to code so the right event is processed. Most browsers uses First the function try to locate the variable e value, because we didn’t provide it in the html Once we have our object assign to the variable the function call for the That’s it. Nothing to it, I hope this help my fellow coders.<\/p>\n Thanks to Happy Coding!<\/p>\n","protected":false},"excerpt":{"rendered":" I was searching for this for very long and didn’t really found something useful unless using a\u00a0JavaScript\u00a0framework, but for those who want to learn to code from scratch this is the answer. First you have to get the element that triggers an event. example: HTML <div id=”hello” onclick=”getId();”><\/div> <!– in Firefox is necessary to include […]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[7],"tags":[70,71,72,16,73],"class_list":["post-93","post","type-post","status-publish","format-standard","hentry","category-tutorials","tag-dom-elements","tag-element","tag-id","tag-javascript","tag-jquery"],"acf":[],"jetpack_featured_media_url":"","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/designersgate.com\/blog\/wp-json\/wp\/v2\/posts\/93","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/designersgate.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/designersgate.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/designersgate.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/designersgate.com\/blog\/wp-json\/wp\/v2\/comments?post=93"}],"version-history":[{"count":0,"href":"https:\/\/designersgate.com\/blog\/wp-json\/wp\/v2\/posts\/93\/revisions"}],"wp:attachment":[{"href":"https:\/\/designersgate.com\/blog\/wp-json\/wp\/v2\/media?parent=93"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/designersgate.com\/blog\/wp-json\/wp\/v2\/categories?post=93"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/designersgate.com\/blog\/wp-json\/wp\/v2\/tags?post=93"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}HTML<\/code><\/p>\n<div id=\"hello\" onclick=\"getId();\"><\/div><\/span>\n<!-- in Firefox is necessary to include the event in the function --><\/span>\n<div id=\"hello\" onclick=\"getId(event);\"><\/div><\/span><\/pre>\ngetId(e)<\/code> function with: (note that I didn’t pass any value in the html code for any browser except Firefox<\/span>)<\/p>\nfunction getId<\/span>(e){<\/span>\n var tgt<\/span>;<\/span>\n var id<\/span>;<\/span>\n if (!e) var e<\/span> = window<\/span>.event<\/span>; \/\/ if e is undefined<\/span><\/span>\n if (e.target<\/span>) tgt<\/span> = e.target<\/span>; \/\/ For most browsers <\/span><\/span>\n else if (e.srcElement<\/span>) tgt = e.srcElement<\/span>; \/\/ For microsoft browsers <\/span><\/span>\n if (tgt<\/span>.nodeType<\/span> == 3<\/span>) \/\/ To avoid webkit bug <\/span><\/span>\n tgt<\/span> = tgt<\/span>.parentNode<\/span>; <\/span>\n id<\/span> = tgt<\/span>.getAttribute<\/span>('id'<\/span>,2<\/span>);<\/span>\n alert<\/span>(id<\/span>);<\/span>\n}<\/span><\/pre>\nwindow.event.target<\/code><\/span> while Microsoft uses window.event.srcElement<\/code><\/span>.<\/p>\ne<\/code> variable is undefined, so the function create the event, then try to assign the window.event.target<\/code><\/span> as the variable tgt<\/code><\/span> value, if this doesn’t work, the creates the window.event.srcElement<\/code><\/span> object as the variable value. If this failed, for Safari bug then it looks for the window.event.nodeType<\/code> object and assigned it to the variable.<\/p>\ngetAttribute()<\/code><\/span> element object. First you tell the attribute name you are targeting, in this case the id<\/code> attribute. The second value 2 is to get exactly the value of the attribute. Another options are 0 that’s a default and perform a non-case sensitive search or 1 that perform a case-sensitive search of the value. I decided to use 2 because returns the property value as it is set in the script or html code.<\/p>\n
\n www.quirckmodes.com<\/a>
\n www.roseindia.net<\/a><\/p>\n