HTML的三种添加事件方式

最新推荐文章于 2021-06-09 13:28:44 发布
最新推荐文章于 2021-06-09 13:28:44 发布
阅读量648 收藏 1
点赞数
分类专栏： JavaScript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/low1101/article/details/103280294
版权

添加事件就是绑定事件：

第一种：直接在标签里添加事件=方法名（）

<body>
    <span onclick="t()" id ="time">添加事件</span>
    <script>
        function t(){
        console.log("事件")
        }
    </script>
<body>

 

第二种：通过addEventListener方法添加事件和方法 方法名（）

<body>
    <span id ="time">添加事件</span>
	<script>
	document.getElementById("time").addEventListener("click", function t(){console.log("事件")});
	</script>
<body>

第三种：直接添加.事件=方法 方法名（）

<body>
    <span id ="time">添加事件</span>
	<script>
        document.getElementById("time").onclick=function t(){console.log("事件")};
	</script>
<body>

 

6666，
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
如何为HTML元素添加事件
bravery__的博客
07-17 582
1.直接通过onclick属性绑定函数 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script> function test(){ console.log("HelloWorld"); } </script> </head> <body>
Javascript中绑定click事件的四种方式介绍
12-04
一：HTML中添加onclick <button id="vv" onclick="myfunction()" >哈哈</button> 二：JS中定义函数绑定事件！ var funcc = function () { alert('我爱编程') } var aa = document.getElementById('vv') aa.onclick = funcc 三：直接定义函数与内容 document.getElementById('vv').onclick = function () { alert('hasssshhaa ') } 四：利用addEventLis
HTML添加事件的方式
S_Tian的博客
11-27 257
HTML一共有三种添加事件的方式： 以onclick为例 第一种： <body> <span onclick="test()">hello</span> <script> function test(){ console.log(123); } </script> </body> 第二种： <body...
如何给HTML添加事件？
不动声色的小蜗牛的博客
07-17 1749
第一种方式： 直接在相应的HTML标签中添加相应的属性，通过属性去添加事件。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HTML添加事件的方式（一）</title> <script> function test(){ console.log("HelloWorld!"); } </script&gt
如何在HTML中添加事件，几种方法？
qq_43141894的博客
09-20 5310
1、标签之中直接添加 onclick="fun()"; 2、JS添加 Eobj.onclick = method; 3、绑定事件  IE： obj.attachEvent('onclick', method)；             FF: obj.addEventListener('click', method, false);  ...
如何给HTML元素添加事件
miaosanpi的博客
08-19 242
第一种方法 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>添加事件</title> </head> <script> function test(){ console.log("你按我干嘛！"); } </script> <body> <input type="bu
JavaScript事件处理的方式(三种)
11-25
JavaScript事件处理程序有三种常见的添加方式： 1. HTML事件处理程序：这是最直观的方式，直接在HTML元素中通过属性（如`onclick`）绑定事件处理函数。但这种方式将JavaScript逻辑嵌入HTML，导致代码耦合度高，不...
js在HTML的三种引用方式详解
10-14
- 使用`<script>`标签：另一种内联方式是在`<script>`标签内编写JS代码，通过`getElementById`方法获取元素并添加事件监听器。需要注意的是，为了确保页面元素加载完毕，`<script>`标签通常放置在`<body>`标签的底部...
javascript 动态添加事件代码
10-30
在JavaScript中，动态添加事件是常见的需求，但因为不同浏览器之间的兼容性问题，需要采用不同的方法来实现。以下是关于如何在JavaScript中动态添加事件的详细讲解： 1. **setAttribute方法**： `setAttribute` 是...
javascript中为某个元素指定事件的三种方式
10-25
在JavaScript中，为某个元素指定事件是常见的交互设计方式，主要分为三种方法：使用`onclick`属性、在JavaScript中设置`onclick`属性以及使用`addEventListener`方法。这三种方法各有特点，下面将详细阐述它们的用法...
JS动态给对象添加事件的简单方法
10-21
- `addEventListener`用于添加事件监听器，接受三个参数：要监听的事件名、回调函数以及一个可选的布尔值`useCapture`（默认为`false`）。例如： ```javascript document.getElementById("txtPrice")....
给某个标签，添加事件（onclick、change等事件），有两种，1在html标签中直接加上事件 2在页面加载完成后，在ready函数中给标签添加事件，特别是对于自己封装的控件如box，一般都是用2
Ideality_hunter的专栏
10-24 1645
给某个标签，添加事件（onclick、change等事件），有两种，1在html标签中直接加上事件 2在页面加载完成后，在ready函数中给标签添加事件，特别是对于自己封装的控件如box，一般都是用2 因为：自己封装的空间，不是标准的html标签，没办法添加事件，除非自定义的控件自己定义了触发事件，在加载完成后，前端框架，如box或者miniui等，会对空间进行初始化，转变成标准的html标签。
在html页中给元素添加事件
tyds715的专栏
11-12 1630
说明： Div2 Element onSubmit= ， onclick= 元素的这一类属性， 以下统称为事件处理属性。 他的值 称为 事件处理代码 一、一般，我们给html页中元素添加事件处理的js 代码 有以下几个方法 1，第一种添加事件的方式，直接在html的元素的事件处理属性中写JS代码      直接写JS代码 2.第二种添加事件的方式，定义一个函数，赋值给html
动态生成的html添加事件
weixin_30508241的博客
10-24 334
一、问题描述 　　用jQuery的append()方法动态添加了一段html代码之后，发现在为新添加的元素绑定click事件时无法获取该新元素。 二、解决方法 　　度娘推荐的方法基本是用live()方法 　　live()的官方定义和用法: 　　live() 方法为被选元素附加一个或多个事件处理程序，并规定当这些事件发生时运行的函数。通过 live() 方法附加的事件处理程序适用于匹配选择...
HTML中如何给HTML元素添加事件
zzu957的博客
07-17 443
方法一： 代码示例： <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script> function test(){ console.log("hello world!"); } </script> </head> <body> <input t
如何给html加事件,在html页中给元素添加事件
weixin_33055757的博客
06-09 1506
函数 myclk 是事件处理函数，它的返回值就是事件处理返回值。他返回 true 则继续提交表单 返回false则停止提交， 返回页面。在js代码里， 给事件处理属性赋值，只能赋值为一个函数， 比如：document.getElementByIdx_x_x_x_x("login").onsubmit= function(){...};或者document.getElementByIdx_x_x_...
如何添加HTML元素的事件处理，有几种方法
weixin_42985225的博客
09-04 2654
添加html元素的事件有三种方法。 1.通过HTML元素属性。简单说来就是在html结构中，给你要添加事件的元素添加一个属性。 属性名为 ‘on’ + 事件名。 如:你要给a元素绑定一个click事件，你就该这么写： name 2.通过对象属性。 对象指的是jDOM树里的对象，我们都知道，所有的html元素在DOM(文档对象类型)里都存在一个相应的DOM元素。 给这个DOM元素添加事...
标签绑定事件的两种方式
weixin_30480583的博客
03-18 526
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <!--第一种传参方式--> <div id...
如何给HTML中的特殊按钮添加事件处理
u013455166的专栏
02-08 1832
在HTML中<input type="submit">还有<input type="reset">特殊按钮特殊处理。我们可以在form上增加 onSubmit 和 onReset 事件： <form onsubmit='alert("submit");'></form> <form onreset='alert("reset");'&g...
html怎么实现事件监听,js事件监听的几种方式
最新发布
06-07
HTML 中实现事件监听可以通过添加事件属性来实现，例如： ```html <button onclick="alert('Hello World!')">Click me</button> ``` 这里的 onclick 就是一个事件属性，表示在按钮被点击时触发的操作。 在 JavaScript 中，事件监听可以通过以下几种方式实现： 1. 通过元素的属性来添加事件监听函数，例如： ```javascript const button = document.querySelector('button'); button.onclick = function() { alert('Hello World!'); }; ``` 2. 使用 addEventListener 方法添加事件监听，例如： ```javascript const button = document.querySelector('button'); button.addEventListener('click', function() { alert('Hello World!'); }); ``` 3. 使用事件监听器对象，例如： ```javascript const button = document.querySelector('button'); button.addEventListener('click', function() { alert('Hello World!'); }); ``` 以上是 JavaScript 中实现事件监听的三种常见方式。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值