首页 > 其他 > 详细

事件委托小效果

时间:2019-11-22 13:51:31      阅读:68      评论:0      收藏:0      [点我收藏+]

事件委托

	<body>
		<input type="button" value="创建新的" id="btn"/>
		<ul class="box">
			<li>1</li>
			<li>2</li>
			<li>3</li>
			<li>4</li>
			<p>嘿嘿</p>
		</ul>
	</body>
</html>
<script>
	var box = document.getElementsByClassName("box")[0];
	var btn = document.getElementById("btn");
	btn.onclick = function(e){
		var oLi = document.createElement("li");
		oLi.innerHTML = "新兄弟";
		box.appendChild(oLi);
	}
	box.onclick = function(e){
		var e = e || event ;
		var target = e.target || e.srcElement ;
		if(target.tagName == "LI"){
			target.style.fontSize = "40px";
			target.style.background = "red"
		}
	}
</script>

  

事件委托小效果

原文:https://www.cnblogs.com/xiaoyaolang/p/11910640.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!