click和onclick本质的区别
原生javascript的click在w3c里边的阐述是DOM button对象,也是html DOM click() 方法,可模拟在按钮上的一次鼠标单击。
button 对象代表 HTML 文档中的一个按钮。button元素没有默认的行为,但是必须有一个 onclick 事件句柄以便使用。
语法:buttonObject.click()
<html>
<head>
<script type="text/javascript">
function clickButton()
{
document.getElementById('button1').click()
}
function alertMsg()
{
alert("Button 1 was clicked!")
}
</script>
</head>
<body onload="clickButton()"> <form>
<input type="button" id="button1" onclick="alertMsg()" value="Button 1" />
</form> </body>
</html>
onclick是一个事件,Event对象 。支持该事件的 JavaScript 对象:button, document, checkbox, link, radio, reset, submit
HTML DOM Event 对象,代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。事件通常与函数结合使用,函数不会在事件发生前被执行!
<html>
<body>
Field1: <input type="text" id="field1" value="Hello World!"><br />
Field2: <input type="text" id="field2"> <br />
点击下面的按钮,把 Field1 的内容拷贝到 Field2 中: <br />
<button onclick="document.getElementById('field2').value=document.getElementById('field1').value">Copy Text</button>
</body>
</html>
区别
前面说了click是一个方法,onclick是一个事件。
而最根本的问题是,方法和事件的区别是什么呢?
其区别在于: 1.事件名前一般都以on开头; 2.方法是程序员写语句直接调用,即显示调用;【可以触发onclick事件】 3.事件不需程序员调用,但是,必须由程序员写一个函数且将该函数赋值给相应的事件,其调用是在相应的事件触发时。【告诉浏览器在鼠标点击时候要做什么】 所以调用顺序是:首先方法其次事件。
可以扩展学习和参考的文章:
2.$(“”).click与onclick的区别示例介绍
地址:http://www.jb51.net/article/55650.htm
3.从零开始学习jQuery (五) jquery事件与事件对象
地址:http://www.jb51.net/article/26331.htm
4.jquery动态移除/增加onclick属性详解
地址:http://www.php100.com/html/program/jquery/2013/0905/5964.html
转载本人博文时请注明出处和原文地址!!!
click和onclick本质的区别的更多相关文章
- 原生js:click和onclick本质的区别
原生javascript的click在w3c里边的阐述是DOM button对象,也是html DOM click() 方法,可模拟在按钮上的一次鼠标单击. button 对象代表 HTML 文档中的 ...
- 原生js:click和onclick本质的区别(转https://www.cnblogs.com/web1/p/6555662.html)
原生javascript的click在w3c里边的阐述是DOM button对象,也是html DOM click() 方法,可模拟在按钮上的一次鼠标单击. button 对象代表 HTML 文档中的 ...
- javascript 中 click 和onclick有什么区别呢
<script type="text/javascript"> $(function(){ $("#btn4").click(function(){ ...
- click()和onclick()的区别
click()和onclick()的区别: 1.onclick是绑定事件,告诉浏览器在鼠标点击时候要做什么 click本身是方法作用是触发onclick事件,只要执行了元素的click()方法,就会触 ...
- addEventListener的click和onclick的区别
前两节都和addEventListener的click有关,于是在想它与onclick有什么区别呢,自己调试了一下,网上也有相关资料 事件绑定 onclick绑定方式 优点: - 简洁 - 处理事件的 ...
- change和onchange、click和onclick的区别
change和onchange.click和onclick的区别: onchange和onclick都是js方法 可以在标签元素上使用 <input onchange="" ...
- 关于click和onclick的区别
click()和onclick()的区别: 1.onclick是绑定事件,告诉浏览器在鼠标点击时候要做什么 click本身是方法作用是触发onclick事件,只要执行了元素的click()方法,就会触 ...
- Html A标签中 href 和 onclick用法、区别、优先级别
原文:Html A标签中 href 和 onclick用法.区别.优先级别 如果不设置 href属性在IE6下面会不响应hover.双击后会选中标签的父容器而非这个一a标签(IE下都存在这一问题). ...
- js click 与 onclick 事件绑定,触发与解绑
click 与 onclick 1.onclick 事件会在对象被点击时发生. <input id="btn1" type="button" onclic ...
随机推荐
- sqlserver怎么将查询出来的数据存到新的数据库表中
查询结果直接创建一个新表存放select * into [新表名] FROM [原表名]WHERE 车辆='小汽车' 若新建表要放在另一个数据库B中USE BGOSELECT * INTO [新表名] ...
- java中数组的排序,直接排序,冒泡排序,插入排序
1.直接排序: public static void selectSort(int[] arr) { for (int x = 0; x < arr.length - 1; x++) { for ...
- jquery 实现table的动态合并列
常见的table是一行一列的形式,当有时会遇到后台的数据在前台显示时, 需要显示多对一,eg: 这是后台初始的数据,现在我要显示为: 思路:将第3列的td的rowspan改为为行数, 删除第一行之外的 ...
- 为什么我最终替换掉了NATS
之前公司没有使用msmq/rebbitmq等消息队列,一方面是觉得太重,想避免在引入中间件.另外的原因是公司的业务并不需要消息持久化和确保可送达(at-least-once VS at-more-on ...
- 开源半成品的Web版工作流模板设计器(基于AngularJS 2和Redux), 还在继续填坑中
先上个图: 很多企业内部的应用都需要有个工作流平台(插件),无奈灵活方便好用且能够自行更改代码定制嵌入的实在不多,只好自己动手慢慢搞. https://github.com/shibamo/99-fl ...
- 模拟java的split函数,分割字符串,类似于java的split方法
/*自定义oracle的分割函数*//*定义一个type,用户接收返回的数据集合类型*/create or replace type splitType as table of varchar2(40 ...
- 蓝桥网试题 java 基础练习 十六进制转八进制
- -------------------------------------------------------------------------------------------------- ...
- MiniProfiler工具介绍
MiniProfiler是一款针对.NET, Ruby, Go and Node.js的性能分析的轻量级程序.可以对一个页面本身,及该页面通过直接引用.Ajax.Iframe形式访问的其它页面进行监控 ...
- C++编程练习(4)----“实现简单的栈的链式存储结构“
如果栈的使用过程中元素数目变化不可预测,有时很小,有时很大,则最好使用链栈:反之,如果它的变化在可控范围内,使用顺序栈会好一些. 简单的栈的链式存储结构代码如下: /*LinkStack.h*/ #i ...
- 如何增强ArcGIS插值图出图效果
如何增强ArcGIS插值图出图效果 by 李远祥 在一些科研领域,经常会遇到使用插值的方式进行处理,并生成最终的插值图.插值图在ArcGIS里面非常容易生成,只要具备了采用点数据,通过ArcToolB ...