JQuery In Action 第四章学习笔记
onclick="say('Vroom vroom!');"
DOM Level 0 事件模型
说明 DOM Level 0 事件处理
<html>
<head>
<title>DOM Level 0 Events Example</title>
<script type="text/javascript"
src="../scripts/jquery-1.2.1.js">
</script>
<script type="text/javascript">
$(function(){
$('#vstar')[0].onmouseover = function(event) {
say('Whee!');
}
});
function say(text) {
$('#console').append('<div>'+new Date()+' '+text+'</div>');
}
</script>
</head>
<body>
<img id="vstar" src="vstar.jpg"
onclick="say('Vroom vroom!');"/>
<div id="console"></div>
</body>
</html>
if (!event) event = window.event;
如果浏览器不支持event对象，就返回window.event。
var target = (event.target) ? event.target : event.srcElement;
如果event.target已被定义，就返回event.target给target。如果没有，就返回event.srcElement。
事件的扩散充从DOM Tree的原点到顶点。
<html id="greatgreatgrandpa">
<head>
<title>DOM Level 0 Events Example</title>
<script type="text/javascript"
src="../scripts/jquery-1.2.1.js">
</script>
<script type="text/javascript">
$(function(){
$('*').each(function(){
var current = this;
this. onclick = function(event) {
if (!event) event = window.event;
var target = (event.target) ?
event.target : event.srcElement;
say('For ' + current.tagName + '#'+ current.id +
' target is ' + target.id);
}
});
});
function say(text) {
$('#console').append('<div>'+text+'</div>');
}
</script>
</head>
<body id="greatgrandpa">
<div id="grandpa">
<div id="pops">
<img id="vstar" src="vstar.jpg"/>
</div>
</div>
<div id="console"></div>
</body>
</html>
addEventListener(eventType,listener,useCapture)
DOM Level 2 事件模型
