html标签中绑定触发事件与js中绑定触发事件写法上的区别

最新推荐文章于 2022-10-12 12:37:34 发布
最新推荐文章于 2022-10-12 12:37:34 发布
阅读量252 收藏
点赞数
文章标签： javascript ViewUI
原文链接：https://my.oschina.net/u/2476661/blog/523453
版权 
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js中方法名后加括号和不加口号的区别</title>
</head>
<body>
<div id="target"> 
</div> 
<button id="btn" onclick="test()">按钮</button> 
</body>
</html>

<script type="text/javascript">
var test = function(){ 
var span = document.createElement("span"); 
span.innerHTML="添加"; 
document.getElementById("target").appendChild(span); 
}

//document.getElementById("btn").onclick=test; 
//document.getElementById("btn").onclick=test(); 
</script>

如上述的代码，

在button标签中绑定onclick事件，要写成test()，不能写成test，test是指向一个function，当点击按钮的时候，test()就告诉浏览器执行test函数，而test只是告诉了浏览器test函数，并没有要执行

在js中onclick绑定时，要写成test，这样就会把test函数绑定在按钮上，当点击的时候就执行，如果写成test()的话，在onclick绑定时就执行了test函数，所以onclick绑定的东西是test执行后的结果或者返回函数，如果想绑定的是某个函数的返回函数(return function{})，就可以用οnclick=test();


以上是通过网上找资料、自己实践后自我总结的一点看法，和大家分享下，如果有什么写的不对地方还请大家多多包涵、多提提意见



转载于:https://my.oschina.net/u/2476661/blog/523453

chikan1964
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
HTML的事件绑定、js的this指向以及 闭包 的问题
s1300352164的博客
12-29 685
一：html事件绑定 1.标签绑定 直接在标签上添加需要绑定的事件 2.元素绑定 获取页面内的标签元素，加以绑定事件 3.使用事件监听 二：this指向 1.浏览器里，在全局范围内的this 指向window对象； 2.在函数中，this永远指向最后调用他的那个对象； 3.构造函数中，this指向new出来的那个新的对象； 总结：谁调用它就指向谁 这里举一个例子： 在平常的工作环境中，为了更好的掌握this指向，我们可以 let vm = this 这里我们还可以直接...
JQuery调用绑定click事件的3种写法
10-24
`.bind()`是jQuery中更通用的事件绑定方法，不仅可以绑定`click`事件，还可以绑定其他多种事件，如`mouseover`、`mouseout`等。下面是如何使用`.bind()`绑定`click`事件的例子： ```javascript $('#clickmebind')....
将事件绑定在html标签中和js动态绑定的区别
weixin_30378311的博客
10-29 128
一:绑定在标签中： 能够一眼看出那些元素绑定了什么事件。 只能将元素和事件逐一实现绑定。 二js动态绑定： 可以一次动态的给多个元素绑定事件，批量绑定事件。 html标签绑定的缺点： ①：可能有时间差。如果js代码在html标签之后，用户激活事件时，事件如果还没有被解析，则会引起报错。（一般用try,catch解决，这样错误便不会付出水面。）。 ②：不同浏览器在解析事件的作用域链接时...
事件绑定与触发事件
Sumshine12.5
02-20 1722
bind()方法绑定事件 1.绑定一种事件 .bind("click",function(){ .... }) 2.绑定多个事件,通过对象的方式 .bind({"click":function(){},"mouseover":function(){}...)}) 为创建子元素绑定事件 父元素.delegate("要绑定事件的元素","事件名","执行函数") 对应解绑事件undelegate...
给某个标签，添加事件（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双向绑定,js html双向绑定Demo
weixin_42511151的博客
07-09 123
var user = new User('123');$(function(){user.set( "name", "99" );});function GetData() {alert(user.attributes.name);}function DataBinder( object_id ) {var pubSub = jQuery({});var data_attr = "bind-" +...
datagridview 按钮列 绑定事件触发
04-27
以下将详细介绍如何在DataGridView中创建按钮列并绑定事件触发。 1. **创建按钮列** 要在DataGridView中添加按钮列，首先需要在设计时或运行时创建一个DataGridViewTextBoxColumn对象，然后将其设置为...
jQuery中的bind绑定事件与文本框改变事件的临时解决方法
10-28
在jQuery中，`bind`函数是用来绑定事件处理函数到元素上的。这个方法允许开发者将一个或多个事件处理器关联到DOM元素上，以便当特定的事件发生时，这些处理函数会被调用。在提及的场景中，作者遇到了在文本框(`...
javascript 处理事件绑定的一些兼容写法
10-29
本文将详细讲解JavaScript处理事件绑定的一些兼容性写法，适用于不同的浏览器环境。 首先，让我们看一个基本的事件绑定函数的实现。这个函数`addEvent`接受三个参数：目标对象`obj`，事件类型`type`，以及事件处理...
JavaScript中点击事件的写法
10-22
上述代码会触发ID为`target`的按钮的点击事件，这与用户实际点击按钮的效果相同，包括触发`onclick`属性绑定的函数和事件监听器。 ```javascript function load() { document.getElementById("target").click(); /...
html数据绑定js库,Vue.js 数据绑定
weixin_33850554的博客
06-04 276
Vue.js 数据绑定Vue.js支持不同类型的数据绑定。在学习Vue.js中的数据绑定之前，让我们看一下什么是数据绑定以及如何使用它。什么是数据绑定？数据绑定是一种用于将提供者和使用者的数据源绑定在一起并在检索时进行同步的技术。在数据绑定过程中，每当更改数据时，数据便会自动通过绑定到数据的元素反映出来。术语数据绑定也用于元素中数据的外部表示发生变化的情况，并自动更新基础数据以反映此更改。Vue....
html事件中写js,html标签中绑定触发事件与js中绑定触发事件写法上的区别
weixin_35701203的博客
05-31 153
html>js中方法名后加括号和不加口号的区别按钮vartest=function(){varspan=document.createElement("span");span.innerHTML="添加";document.getElementById("target").appendChild(span);}//document.getElementById("btn").on...
关于html onclick 与js onclick 初学思考
热门推荐
OOP___的博客
10-31 1万+
相信大家都用过 html onclick 与js onclick 这两个事件函数。先来看一下两者的用法！ html中的onclick的用法： 列子：Example html 中的onclick 是作为一个属性，后面写上js代码，若要写多条代码则可以用“”；“”来分开语句 再看一下js 中的onclick 列子：function test()             {
如何关联JS与HTML
weixin_50878401的博客
09-29 3336
如何关联JS与HTML关联 js通过id操作html组件 代码示例 <!--html--> <input type="text" id="myqr">//设定组件的id为“myqr” //js var love = document.getElementById('myqr');//通过id获取对应组件的索引 var a = love.value;//将组件的value属性值赋给变量a love.value = "love you so much";//将组件的输入内容设为该字符串
ajax返回的html内容绑定不了js事件
Isaac Lin
03-20 1794
bug描述 用ajax来动态改变网站的某一块内容，然后发现无法对其绑定js事件。用getElementsByClassName获取的数组长度也是为0。以下为Ajax返回的内容。 out.write("&lt;div class=\"fansItem\" id=\"fansItem\"&gt;"); out.write("&lt;img src=\"/user/portrait/pic_"
HTML之JavaScript事件绑定方式小结
qq_44829555的博客
05-30 359
一、嵌入dom <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> <script type="text/javascript" src="js/jquery-1.8.3.js" ></script> ...
html事件中写js,关于JavaScript与HTML的交互事件
weixin_39752828的博客
05-31 196
JavaScript和HTML的交互是通过事件实现的。JavaScript采用异步事件驱动编程模型，当文档、浏览器、元素或与之相关对象发生特定事情时，浏览器会产生事件。如果JavaScript关注特定类型事件，那么它可以注册当这类事件发生时要调用的句柄。事件流事件流描述的是从页面中接收事件的顺序，比如有两个嵌套的div，点击了内层的div，这时候是内层的div先出发click事件还是外层先触发？目...
JS事件绑定（addEventListener）和普通事件（onclick）有什么区别
小白菜的博客
12-26 2630
JS事件绑定（addEventListener）和普通事件（onclick）有什么区别 普通事件（onclick） 普通事件就是直接触发事件，同一时间只能指向唯一对象，所以会被覆盖掉。代码如下： var btn = document.getElementById("btn"); btn.onclick = function(){ alert("你好111"); } btn.onclick = f...
Javascript编程 ——如何给HTML的元素绑定事件
老程的技术笔记
10-12 959
【代码】Javascript编程 ——如何给HTML的元素绑定事件。
C#文本框输入后立即触发事件
最新发布
07-28
- *1* *2* [文本框内容自动投影，浅谈C#中事件的写法与应用](https://blog.csdn.net/ylq1045/article/details/127034812)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值