同样的功能,不同的书写格式。

1.个人觉得比较繁琐的写法,但是比较常见,特别是在大项目的时候常用的就是这种方法:

<div id="mouse" onmouseover="mOver()" onmouseout="mOut()" style="background-color:#D94A38;width:120px;height:20px;padding:40px;">Mouse Over Me</div>
<script>
function mOver(){
document.getElementById("mouse").innerHTML="Thank You"
}
function mOut(){
document.getElementById("mouse").innerHTML="Mouse Over Me"
}
</script>

2.这个中法比较简单,而且可以少些不少代码:

<div onmouseover="mOver(this)" onmouseout="mOut(this)" style="background-color:#D94A38;width:120px;height:20px;padding:40px;">Mouse Over Me</div>
<script>
function mOver(obj){
obj.innerHTML="Thank You"
}
function mOut(obj){
obj.innerHTML="Mouse Over Me"
}
</script>

利用DOM节点找对象和直接在标签属性中调函数传值this的书写区别的更多相关文章

  1. DOM节点中获取文本易混淆的属性

    DOM 节点中对于获取文本易混淆的属性,innerText, innerHTML, outerHTML, textContent, nodeValue. 一个实例: <!DOCTYPE html ...

  2. DOM节点的增删改查以及class属性的操作

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. React 事件对象、键盘事件、表单事件、ref获取dom节点、react实现类似Vue双向数据绑定

    1.案例实现代码 import React, { Component } from 'react'; /** * 事件对象.键盘事件.表单事件.ref获取dom节点.react实现类似Vue双向数据绑 ...

  4. DOM中Event 对象如何使用

    DOM中Event 对象如何使用 一.总结 一句话总结: 1.将event作为参数传递进来,然后就可以调用event对象的各种属性和方法了. <body onmousedown="wh ...

  5. JS-DOM ~ 03. 子节点的操作、style.样式和属性、dom元素的创建方法及操作、14个例题、主要是利用js直接控制html属性

    带有Element和不带的区别 a)  带Element的获取的是元素节点 b)  不带可能获取文本节点和属性节点 获取所以子节点 a)   . childNodes b)   . children ...

  6. javascript之DOM编程通过html元素的标签属性找节点

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. JavaScript 基础(三) - Date对象,RegExp对象,Math对象,Window 对象,History 对象,Location 对象,DOM 节点

    Date对象 创建Date对象 //方法1:不指定参数 var date_obj = new Date(); alert(date_obj.toLocaleString()) //方法2:参数为日期字 ...

  8. React对比Vue(03 事件的对比,传递参数对比,事件对象,ref获取DOM节点,表单事件,键盘事件,约束非约束组件等)

    import React from 'react'; class Baby extends React.Component { constructor (props) { super(props) t ...

  9. 六、React 键盘事件 表单事件 事件对象以及React中的ref获取dom节点 、React实现类似Vue的双向数据绑定

    接:https://www.cnblogs.com/chenxi188/p/11782349.html 事件对象 .键盘事件. 表单事件 .ref获取dom节点.React实现类似vue双向数据绑定 ...

随机推荐

  1. BZOJ 2597: [Wc2007]剪刀石头布(费用流)

    传送门 解题思路 考虑全集-不能构成三元环的个数.如果三个点不能构成三元环,一定有一个点的入度为\(2\),继续扩展,如果一个点的度数为\(3\),则会失去3个三元环.对于一个点来说,它所产生的不能构 ...

  2. 剑指offer——数组中出现次数超过一半的数字(c++)

    题目描述数组中有一个数字出现的次数超过数组长度的一半,请找出这个数字.例如输入一个长度为9的数组{1,2,3,2,2,2,5,4,2}.由于数字2在数组中出现了5次,超过数组长度的一半,因此输出2.如 ...

  3. (转)Linux 多线程编程---pthread_testcancel()等讲解

    1.   所谓线程就是“一个进程内部的一个控制序列”.也就是一个进程内部的并行的基础! 2.    Linux进程可以看成只有一个控制线程:      一个进程在同一时刻只做一件事情.有了多个控制线程 ...

  4. (转)深刻理解Linux进程间通信(IPC)

    转:http://www.ibm.com/developerworks/cn/linux/l-ipc/index.html 序 linux下的进程通信手段基本上是从Unix平台上的进程通信手段继承而来 ...

  5. 30天轻松学习javaweb_修改tomcat的servlet模板

    在MyEclipse目录下搜索com.genuitec.eclipse.wizards 得到搜索结果 com.genuitec.eclipse.wizards_9.0.0.me201108091322 ...

  6. Django--实现分页功能,并且基于cookie实现用户定制每页的数据条数

    # page_num 当前页数, total_result_num 总共有多少条测试结果 def pagination(request, page_num, total_result_num, res ...

  7. thinkphp+layui多图上传(1)thinkphp5+layui实现多图上传保存到数据库,可以实现图片自由排序,自由删除。

    公共css代码 <style> .layui-upload-img { width: 90px; height: 90px; margin: 0; } .pic-more { width: ...

  8. install busybox时报error: storage size of ‘rlimit_fsize’ isn’t known struct rlimit rlimit_fsize

    解决办法: 在busybox根目录下查找到文件:find -name libbb.h 在libbb.h.h中包含sys/resource.h 说明: 上述错误的原因是rlimit结构体未知,原因是相应 ...

  9. Cell的复用机制问题总结

    创建方式汇总,注册和不注册Cell注册的两种方式 1.tableView registerNib:(nullable UINib *) forCellReuseIdentifier:(nonnull ...

  10. C++——变量

    1.变量的初始化和赋值 初始化:创建变量时赋予一个初始值 赋值:把变量的当前值擦除,以新的值替代 2.变量的声明和定义 声明:名字为程序所知.如果一个程序要使用另一个程序的名字,则要包含对那个名字的声 ...