Question

js给所有子节点绑定事件

<ul><li>sadada</li><li>sadada</li><li>sadada</li></ul>
给ul的子节点li绑定click事件 用脚本实现 不能在写成这样<li onclick="func()">

Answer 1

用 jQuery 的话，很简单:

$('ul li').click(function(e){
alert($(this).html());
});

自己实现就要麻烦一些:

function attachEvent(obj,evt,fn){
if(obj.addEventListener){
obj.addEventListener(evt, fn, false);
}else if(obj.attachEvent){
obj.attachEvent('on'+evt, fn);
}
}

window.onload = function() {
var ul = document.getElementById('test');
var arr = ul.childNodes;
alert(arr.length);
for(var i=0; i<arr.length; i++) {
if(arr[i].tagName != 'LI') continue;
attachEvent(arr[i], 'click', function(e) {
var li = e.target || e.srcElement;
alert(li.innerHTML);
});
}
}

为了方便，我给 ul 加了个 id：
<ul id="test"><li>sadada</li><li>sadada</li><li>sadada</li></ul>

补充
如果是obj.attachEvent("onclick",function(){arr[i]的一些操作})
这样写的话arr[i]不能传到function（）里 这里有什么好的解决方法么

这样可以解决，不过看起来不是很好。

arr[i].func = function(e) {
alert(this.innerHTML);
}
attachEvent(arr[i], 'click', arr[i].func);

补充二：
还是用以下 HTML 代码作测试
<ul id="test"><li>sadada</li><li>sadada</li><li>sadada</li></ul>

function attachEvent(obj, evt, fn){
obj._fn = obj._fn || {};
obj._fn[evt] = fn;
if(obj.addEventListener){
obj.addEventListener(evt, obj._fn[evt], false);
}else if(obj.attachEvent){
obj.attachEvent('on'+evt, obj._fn[evt]);
}
}

window.onload = function() {
var ul = document.getElementById('test');
var arr = ul.childNodes;
for(var i=0; i<arr.length; i++) {
if(arr[i].tagName != 'LI') continue;
attachEvent(arr[i], 'click', function(e) {
alert(this.innerHTML);
for(var j=0; j<arr.length; j++) {

arr[j].innerHTML = arr[j].innerHTML.replace(/#$/, '');

if(arr[j] != this) {

arr[j].innerHTML += '#';

}
}
});
}
}

可以实现你说的功能。
（点了某个节点，其他节点文字加个 '#'）

实际上你这个问题还是个选择器的问题，你可以看看 jQuery 的 siblings 这个函数，可以得到同层次的兄弟节点，很方便。