var m=function () {
Alert (2);
}
var obj={
A:function () {
},
M:function () {
Alert (3);
},
B:function () {
var m=function () {
Alert (1);
};
var div=document.createelement ("div");
Div.innerhtml= "<p onclick= ' m (); ' >xx</p> ";
Document.body.appendChild (DIV);
}
};
Obj. B ();
It looks as if onclick=m () will call the M function defined inside the B function, not really. HTML is added here, and is an HTML inline trigger event, so the function executes globally, M () is the globally defined m function, the result pops up 2, and the B function scope has no relation at all.
(2)
The potential for a layer of anonymous functions includes:
Example one:
<p id= "F" onclick= "Console.log (This)" >1</P>, value <p id= "FF" onclick= "Console.log (This)" >1</p> Myself.
This is equivalent to:
(p#f). Onclick=function () {
Console.log (this);
};
So this is of course the p#f that invokes the event
Example two:
<p id= "F" onclick= "function A () {alert (this==window);}; A (); " >1</p>
Equivalent:
(p#f). Onclick=function () {
function A () {alert (this==window);};
A ();
};
So this of course a is window.
Example three:
<p id= "F" class= "X" onclick= "A (This)" >1</p>
<script>
var a=function (m) {
alert (m.classname); Click to eject "x"
};
</script>
This is equivalent to:
P#f.onclick=function () {
A (this);
};
This in the function body is bound to be the #f element object, so you can eject m.classname.
Example four:
var m=function () {
Alert (10);
}
var obj={
B:function () {
var m=function () {
Alert (1);
};
var div=document.createelement ("div");
Div.innerhtml= "Cutemurphy";
Div.id= "GG";
Document.body.appendChild (DIV);
document.getElementById ("GG"). AddEventListener ("click", M,false);
}
};
Obj. B (); 1
The result is exactly the opposite of the inline execution event, which pops up 1, not 10. Because its m function is not to go to the global search, but according to the normal function scope chain to find ... Theoretical support is function execution in defined scopes.
Example five:
Var obj={
a:function () {
Console.log (this);
},
b:function () {
&NBS P var m=function () {
(1);
};
var div=document.createelement ("div");
div.innerhtml= "<p id= ' xx ' >xx</p>";
Document.body.appendChild (DIV);
var Xnode=document.getelementbyid ("xx");
Xnode.addeventlistener ("click", this.) A,false);
}
};
obj. B (); //xnode;
It's interesting here, AddEventListener's this.a this refers to obj, and THIS.A's function body functions () {Console.log (This)} is the XNode.
Reference:
Http://www.cnblogs.com/snandy/archive/2011/03/07/1976317.html
The pointer to the binding event this in HTML