html按钮添加链接（事件委派）

最新推荐文章于 2024-06-18 09:28:07 发布

戏命湖

最新推荐文章于 2024-06-18 09:28:07 发布

阅读量1.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： html

本文链接：https://blog.csdn.net/qq_45627570/article/details/101263148

html 专栏收录该内容

5 篇文章

订阅专栏

本文介绍使用JavaScript动态创建并添加带有超链接的列表项到HTML文档的方法，通过按钮触发事件，实现网页上实时生成可点击的超链接。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

	<title></title>
	<script type="text/javascript">
		window.onload=function(){
			var btn01=document.getElementById("btn01");
			var u1=document.getElementById("u1");
			btn01.onclick=function(){
				var li=document.createElement("li");
				li.innerHTML="<a href='javascript:;' class='link'>新建超链接</a>"
				u1.appendChild(li);
				
			};
			var alla=document.getElementById("a");
			u1.onclick=function(){
				event=event||window.event;
				if (event.target.className="link"){
					alert("woshi ul")
				}
			};
		};
	</script>
</head>
<body>
	<button id="btn01">添加</button>
	<ul id="u1" style="background-color: #da1;"> 
		<li>
			<p>我是p元素</p>
		</li>
		<li><a href="javascript:;" class="link">超级连接一</a></li>
		<li><a href="javascript:;" class="link">超级连接二</a></li>
		<li><a href="javascript:;" class="link">超级连接三</a></li>
	</ul>
</body>