JS获取点击事件的内容

点击事件的方法

		<div>
			<a onclick="test()">点击</a>
		</div>

		<script>
		    function test(){
			    var is=event.currentTarget;
			    console.log($(is)); //获取当前元素,类同this  返回绑定事件的元素
			    console.log(event.target);  //返回触发事件的元素
				
			    console.log(event.target.nodeName )  //获取事件触发元素标签name 
			    console.log(event.target.className)   //获取事件触发元素classname
			    console.log(event.target.innerHTML)    //获取事件触发元素的内容
			    console.log(event.target.id) //获取事件触发元素id
			
			    console.log(event.currentTarget.nodeName )  //获取事件绑定元素标签name 
			    console.log(event.currentTarget.className)   //获取事件绑定元素classname
			    console.log(event.currentTarget.innerHTML)    //获取事件绑定元素的内容
			    console.log(event.currentTarget.id) //获取事件绑定元素id
		    }
		</script>

例子如下:

		<button id="btn" onclick="click()">点我</button>
		let btn = document.getElementById("btn");

        // 第一种 绑定点击事件
        btn.onclick = function(){
            alert("这是第一种点击");
        }

        // 第二种 监听点击事件
        btn.addEventListener('click', function(){
            alert("这是第二种点击");
        })

        // 第三种 通过方法响应点击事件
        function click(){
            alert("这是第三种点击");
        }

获取点击事件的内容

		<div class="site-demo-util" id ="sss" οnclick="cli(this)">点我</div>
		//或者
		<li v-on:click="say('hello!', $event)">点击当前行文本</li>

		function cli(event){
			console.log(enent) 
           alert(event.id)//这边就会弹出sss
        };
        function say(msg, event){
			//获取点击对象      
           var el = event.currentTarget;
           alert("当前对象的内容:"+el.innerHTML);
		}

		//方法二
		$(function(){
			$(".site-demo-util").on("click",function(event){
				alert(event.target.id)
		})

})
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐