Javascript怎样阻止事件冒泡和事件本身发生

　　介绍

本篇内容介绍了“Javascript怎样阻止事件冒泡和事件本身发生”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

Javascript可以做什么

1。可以使网页具有交互性,例如响应用户点击,给用户提供更好的体验。 　　2 .可以处理表单,检验用户的输入,并提供及时反馈节省用户时间。 　　3 .可以根据用户的操作,动态的创建页面。 　　4使用JavaScript可以通过设置饼干存储在浏览器上的一些临时信息。

<强> 1。阻止事件冒泡发生

& lt; ! DOCTYPE  html> 　　& lt; html  lang=癳n"祝辞 　　& lt; head> 　　,,,& lt; meta  charset=癠TF-8"比; 　　,,,& lt; meta  http-equiv=癤-UA-Compatible",内容=癐E=edge"比; 　　,,,& lt; meta  name=皏iewport",内容=翱矶?设备宽度,初始=1.0,比; 　　,,,& lt; title> Document 　　,,,& lt; style> 　　,,,,,,,.boxA  { 　　,,,,,,,,,,,溢出:,隐藏; 　　,,,,,,,,,,,宽度:,300 px; 　　,,,,,,,,,,,身高:,300 px; 　　,,,,,,,,,,,保证金:,100 px 汽车; 　　,,,,,,,,,,,,背景颜色:蓝色; 　　,,,,,,,,,,,text-align:,中心; 　　,,,,,,,},,,,,,, 　　,,,,,,,.boxB  { 　　,,,,,,,,,,,宽度:,200 px; 　　,,,,,,,,,,,身高:,200 px; 　　,,,,,,,,,,,保证金:,50 px; 　　,,,,,,,,,,,背景颜色:,绿色; 　　,,,,,,,,,,,行高:,200 px; 　　,,,,,,,,,,,颜色:,# fff; 　　,,,,,,,} 　　,,,& lt;/style> 　　& lt;/head> 　　 　　& lt; body> 　　,,,& lt; div 类=癰oxA"比; 　　,,,,,,,& lt; div 类=癰oxB"祝辞boxB
　　,,,& lt;/div> 　　,,,& lt; script> 　　,,,,,,,var  boxA =, document.querySelector (& # 39; .boxA& # 39;); 　　,,,,,,,var  boxB =, document.querySelector (& # 39; .boxB& # 39;); 　　,,,,,,,boxA.onclick =, function  (e), { 　　,,,,,,,console.log(& # 39;我被点击了boxA& # 39;); 　　,,,}; 　　,,,boxB.onclick =, function  (e), { 　　,,,,,,,e.cancelBubble=true;,//不冒泡 　　,,,,,,,console.log(& # 39;我被点击了boxB& # 39;); 　　,,,}; 　　,,,& lt;/script> 　　& lt;/body> 　　& lt;/html>

<强> 2。阻止事件本身发生

& lt; ! DOCTYPE  html> 　　& lt; html  lang=癳n"祝辞 　　& lt; head> 　　,,,& lt; meta  charset=癠TF-8"比; 　　,,,& lt; meta  http-equiv=癤-UA-Compatible",内容=癐E=edge"比; 　　,,,& lt; meta  name=皏iewport",内容=翱矶?设备宽度,初始=1.0,比; 　　,,,& lt; title> Document 　　& lt;/head> 　　& lt; form  action=癶ttp://www.php.cn",方法=癙OST"比; 　　& lt; button 类型=皊ubmit"祝辞按钮1 & lt;/button> 　　& lt;/form>,,,, 　　& lt; body> 　　,,,& lt; script> 　　,,,,,,,const  btn=document.querySelector (“button"); 　　,,,,,,,console.log (btn); 　　,,,,,,,btn.addEventListener (“click",函数(e) { 　　,,,,,,,,,,,e.preventDefault (); 　　,,,,,,,}); 　　,,,& lt;/script> 　　& lt;/body> 　　& lt;/html>

Javascript怎样阻止事件冒泡和事件本身发生