为了账号安全,请及时绑定邮箱和手机立即绑定

小小的拓展

假如ul下面的li都绑定了点击事件,;;;createElement,就是创建了一个li。但是这个标签他不具备有点击事件,为什么呢?你们自己搜一搜。

正在回答

1 回答

搜索一下事件委托,可以通过事件冒泡到ul元素,避免这种情况

function addClick(){
    	var ul =document.getElementsByTagName('ul')[0];
    	var lis = document.getElementsByTagName('li');
    	var btn=document.getElementsByTagName('button')[0];
    	/*for(var i=0;i<lis.length;i++){
    		lis[i].onclick=function(){
    			alert("我是土著li");
    		}
    	}*/
    	btn.onclick=function(){
    		for(var j=0;j<4;j++){
    			var newLi = document.createElement("li");
    			var newLi_text=document.createTextNode("我是移民li");
    			newLi.appendChild(newLi_text);
    		    ul.appendChild(newLi);
    		}
    	}
    }
//普通的事件绑定,没有办法为新创建的元素绑定事件。所以我们要使用冒泡的特性,事件委托!
//事件委托:将li的事件委托给ul来执行
    function weituo(){
    	var ul =document.getElementsByTagName('ul')[0];
    	ul.onclick=function(event){
    		//获取事件触动的时候传递过来的值
    		event=event||window.event;
    		var aaa=event.target?event.target:event.srcElement;
    		//判断标签名,如果是li标签弹窗
    		if(aaa.tagName==="LI"){
    			alert("我是li");
    		}
    	}
    }
    window.onload=function(){
    	addClick();
    	weituo();
    }


2 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
JavaScript进阶篇
  • 参与学习       468287    人
  • 解答问题       21893    个

本课程从如何插入JS代码开始,带您进入网页动态交互世界

进入课程

小小的拓展

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信