Tuesday, September 3, 2013

addEventlistener and attchEvent

addEventlistener and attchEvent

I have a function that targets the li elements of a div id called
mk-featured-kits. All of this works perfectly.
(function() {
var myNode = document.getElementById('mk-featured-kits');
myNode.addEventListener("mouseover", function(e) {
console.log(e);
if (e.target.tagName === 'LI') {
// all happens here
}
})();
I am using Chrome to see the console log and it allows me to use this path
for the LI's: e.target.tagName.
Since IE 8 and bellow doesn't read addEventListener event, I am using this
(code bellow) to check for the feature. The problem is by using this
technique I can't access the LI using: e.target.tagName === 'LI' because
the event only sees myNode as a tagName === DIV.
(function() {
var myNode = document.getElementById('mk-featured-kits');
if (myNode.addEventListener) { // all browsers except IE before version 9
myNode.addEventListener ("mouseover", function () {myEvent (myNode)},
false);
} else {
if (myNode.attachEvent) { // IE before version 9
myNode.attachEvent ("onmouseover", function () {myEvent (myNode)});
}
}
function myEvent(myNode) {
console.log(myNode);
if (myNode.target.tagName === 'LI') {
// all happens here
}
})();
How can I access the LI as I did on the first script but using the
technique of the second script. Thank you in advance.

No comments:

Post a Comment