div添加一个点击事件（绑定点击事件）

1、HTML onclick 事件属性

<input type="button" value="点我点我" onclick="ds()">

<script>
function ds(){alert('我出现了啊');
}
</script>

https://www.feiniaomy.com/post/339.html

https://www.w3school.com.cn/tags/event_onclick.asp

2、JavaScript 详说事件机制之冒泡、捕获、传播、委托

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><!-- 引入 jQuery 库 --><script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script><style>#parent{width: 200px;height:200px;text-align: center;line-height: 3;background: green;}#child{width: 100px;height: 100px;margin: 0 auto;background: orange;}</style>
</head>
<body>
<div id="btn">点击</div>
<div id="parent">父元素<div id="child">子元素</div>
</div><script type="text/javascript">var btn = document.getElementById("btn");btn.addEventListener('click', function (evt) {console.log('dmji');window.open('http://www.baidu.com','_self')});var parent = document.getElementById("parent");var child = document.getElementById("child");// document.body.addEventListener("click",function(e){//     console.log("click-body");// },false);//// parent.addEventListener("click",function(e){//     console.log("click-parent");// },false);//// //新增事件捕获事件代码// parent.addEventListener("click",function(e){//     console.log("click-parent--事件捕获");// },true);//// child.addEventListener("click",function(e){//     console.log("click-child");//     e.stopPropagation();// },false);// parent.onclick = function(e){//     if(e.target.id == "child"){//         console.log("您点击了child元素")//     }// }parent.addEventListener("click",function(e){const target = e.targetif(target.id==='child'){console.log("您点击了child元素")}},false);</script>
</body>
</html>

https://www.cnblogs.com/bfgis/p/5460191.html

3、BOM（浏览器对象模型）

1>在原来的窗体中直接跳转用
window.location.href="你所要跳转的页面";
2>在新窗体中打开页面用：
window.open('你所要跳转的页面');

注：https://www.cnblogs.com/gcywj/p/9065539.html

https://www.cnblogs.com/lijshui/p/7451360.html

4、JavaScrip中的Window.location.href和Window.open（）方法

window.location.href = 'http://www.baidu.com';

window.open('http://www.baidu.com');

注：https://www.itranslater.com/qa/details/2113789085763503104

div添加一个点击事件（绑定点击事件）相关推荐

微信小程序学习5：小程序语法-事件绑定之给事件传递参数
微信小程序学习5:小程序语法-事件绑定之给事件传递参数前面一讲是关于事件绑定的,下面对事件绑定进行补充. 在用户触发事件,比如点击按钮时,我们往往要传递一下参数用来识别是那个按钮,因为一个界面往往不 ...
【Vue 快速入门系列】Vue数据实现本地存储、自定义事件绑定、全局事件总线、$nextTick的使用
文章目录一.本地存储 1.概念 2.接口 3.实际操作二.自定义事件绑定 1.自定义事件使用过程 2.绑定自定义事件的语法 3.其他注意事项三.全局事件总线 1.全局事件总线概念 2.全局事件总 ...
jQuery-给ul添加了li之后，添加的li并没有绑定点击监听怎么办？
我们看一个简单的例子效果图如下这里面有一个ul里面套着4个li,还有一个独立的li 代码实例: 需求 1.点击li,背景就会变成红色 2.点击btn,就会添加一个li <html>&l ...
jquery js 设置 div 的内容，给 div 添加一个属性
设置 div 的内容的写法: jquery 的写法: $( "#div1" ).html( "aa" ); // 将 div1 元素里面的 html ...
HTML——jQuery之事件绑定、取消事件绑定及事件委托
事件绑定事件绑定有两种方法:分别是:.click() 和.on() <!DOCTYPE html> <html lang="en"> <head&g ...
事件绑定及解除事件绑定
事件绑定的方式 1) ele.onXXX = function(event) {}this 指向 dom 2) ele.addEventListener(type, fn, false);一个事件可以 ...
“约见”面试官系列之常见面试题之第六十篇之事件绑定和普通事件（建议收藏）
一个很简单的示例. 普通添加事件的方法: var btn = document.getElementById("hello"); btn.onclick = function(){ ...
JavaScript解除事件绑定处理程序 js事件绑定解除
//参考 https://mp.csdn.net/postedit/90524536 JavaScript 事件绑定封装一个兼容性事件绑定方法应需求有时候事件绑定触发后就要接触事件. 解除事件绑定方 ...
table.render加入php传值,iView中Table通过render添加一个Input如何双向绑定数据
有一个Table: JS代码如下: export default { data(){ return { columns:[], data:[{name:11111,name2:'加工精度',value ...

div添加一个点击事件（绑定点击事件）

div添加一个点击事件（绑定点击事件）相关推荐

最新文章

热门文章