不明白说的什么。。示例代码有兼容性问题 var list = document.getElementById("list");
list.onclick = function (e) {
e = e || window.event;
var target = e.target || e.srcElement;
alert(target.tagName)
}
list.onclick = function (e) {
e = e || window.event;
var target = e.target || e.srcElement;
alert(target.tagName)
}
你这个可以用jquery的事件委托很简单完成
$('#list').delegate('a','click',function(){
alert(this);
});
list.onclick = function (e) {
}我这也叫冒泡事件。
比如手机网站：
1: 对于结构简单的HTML比如<li>xxx</li>可以很方便通过冒泡／捕获在<li>上来触发事件；
2: 对于结构复杂点的HTML比如<li><h3>xxx</h3><p><strong>xxx</strong>xxx</p></li>，我一般是通过遍历<li>触发事件，能否也像上面一样通过冒泡／捕获在<li>上触发事件呢？<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ul id="listEasy">
<li data-url="google">javascript</li>
<li data-url="facebook">html5</li>
<li data-url="twitter">design</li>
</ul>
<ul id="list">
<li data-url="google">
<h3>javascript<small>(23)</small></h3>
<p><strong>script</strong>:javascript,go.</p>
</li>
<li data-url="facebook">
<h3>html5<small>(3)</small></h3>
<p><strong>mobile</strong>:backnone,angularjs.</p>
</li>
<li data-url="twitter">
<h3>css3<small>(12)</small></h3>
<p><strong>mobile</strong>:web,app.</p>
</li>
</ul>
<script>
//Mobile Site
//listEasy Good
var listE=document.querySelector("#listEasy");
listE.addEventListener("click",function(e){
var target=e.target;
var data=target.getAttribute("data-url");
//...
},false);//list Normal
/*
var list=document.querySelector("#list").querySelectorAll("li");
for(var i=0,len=list.length;i<len;i++){
list[i].onclick=function(){ ... };
}
*///list Good?
</script>
</body>
</html>
right?
那比如这段代码：
<li data-url="google">
<h3>javascript<small>(23)</small></h3>
<p><strong>script</strong>:javascript,go.</p>
</li>
点击<li>里面的任何子元素（h3,small,p,strong），页面都跳转到http://www.google.com（data-url="google"），该如何用冒泡／捕获实现呢？ 谢谢
<h3>javascript<small>(23)</small></h3>
<p><strong>script</strong>:javascript,go.</p>
</li>一般情况下通过遍历<li>然后获取<li>的data-url属性值后进行页面跳转，比如到http://www.google.com。
现在不想遍历<li>，想直接点击<li>里面的任何元素都跳转到http://www.google.com。
谢谢回复，请问这样做和遍历<li>哪个性能更好呢？ 谢谢！