JQ版
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> <script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"> </script> <script> $(document).ready(function () { $("p").click(function () { $(this).hide(); }); }); </script> </head> <body> <p>如果你点我，我就会消失。</p> <p>继续点我!</p> <p>接着点我!</p> </body> </html>
JS版
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>菜鸟教程(runoob.com)</title> </head> <body> <p>如果你点我，我就会消失。</p> <p>继续点我!</p> <p>接着点我!</p> <script> // 使用原生js 实现点击消失效果 window.onload = function () { var ppp = document.getElementsByTagName("p"); console.log(ppp) if (ppp.length > 0) { for (var i = 0; i < ppp.length; i++) { console.log(ppp[i]) ppp[i].addEventListener("click", function () { this.hidden = true; }); } } } </script> </body> </html>
有时间再详细说一下js的事件冒泡和事件捕获。