分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

js事件委托

发布时间:2023-09-06 01:45责任编辑:白小东关键词:js

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<ul id="ul">
<li>我是标签一</li>
<li>我是标签二</li>
<li>我是标签三</li>
<li>我是标签四</li>
<li>我是标签五</li>
</ul>
</body>
</html>
<script type="text/javascript">

/**
* 如果需要给ul下面所有的li都添加一个点击事件的话;我们一般会这么写:
* 这么写需要先找到ul,然后遍历li,然后给所有的li标签添加点击事件
* */
var oli = document.getElementsByTagName("li");
//for (var i=0; i<oli.length;i++) {
//oli[i].onclick = function() {
//console.log(this.innerHTML);
//}
//}

/**
* 运用事件委托怎么处理呢?
* */
var oul = document.getElementById("ul");
oul.onclick = function(event){
var e = event || window.event;
var target = e.target || e.srcElement;
console.log(target.innerHTML);
}


</script>

js事件委托

原文地址:https://www.cnblogs.com/haodoubao/p/8536365.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved