html标签中data-**使用方式

最新推荐文章于 2025-03-05 16:37:53 发布

原创最新推荐文章于 2025-03-05 16:37:53 发布 · 496 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html #前端 #javascript

本文介绍了如何在HTML中使用JavaScript实现点击事件监听，通过`addEventListener`方法打开新窗口并获取元素的data-url和data-aaa属性。

<html>
	<head>
		<script>
			window.onload = function () {
					var confirmElement = document.getElementById('confirm');
					if(confirmElement!=null){
						confirmElement.addEventListener('click',()=>openWindow(event));
					}
			}
			
			function openWindow (event) {
				alert(event.srcElement.dataset.url);
				alert(event.srcElement.dataset.aaa);
			}
		</script>
	</head>
	<input  type="text" name="name" value=""/>
	<a href="#" id="confirm" data-url="123" data-aaa="aaa" >link</a>
</html>