js中的BOM和DOM常用事件方法
笔记:
window对象
● window.innerHeight - 浏览器窗口的内部高度
● window.innerWidth - 浏览器窗口的内部宽度
● window.open() - 打开新窗口
● window.close() - 关闭当前窗口
navigator对象
navigator.appName // web浏览器全称
navigator.appVersion // web浏览器厂商和版本的详细字符串
navigator.userAgent // 客户端绝大部分信息
navigator.platform // 浏览器运行所在的操作系统
screen对象
screen.availWiddth // 可用的屏幕宽度
screen.avaliWidth // 可用的屏幕高度
history对象
window.history对象包含浏览器历史
history.forward() //前进一页
history.back() // 后退一页
location对象
window.location 对象用于获取当前页面的地址URL,并把浏览器重新定向到新的页面。
location.herf // 获取URl
location.herf="URL" // 跳转到指定页面
location.reload() // 重新加载页面
计时相关:
setTimeout() // var t = setTimeout("js语句",毫秒)
clearTimeout() // clearTimeout(setTimeout_variable)
setInterval()
clearInterval() DOM
查找标签:
直接查找
document.getElementById // 根据Id获取一个标签
document.getElementByClassName // 根据class属性获取
document.getElementByTagName // 根据标签名称获取标签合集
间接查找
parentElement // 父节点标签元素
children // 所有子标签
firstElementChild // 第一个子标签元素
lastElementChild // 最后一个子元素元素
nextElementSibling // 下一个兄弟标签元素
previousElementSibling // 上一个兄弟标签元素
节点操作:
创建节点:document.createElement(“标签名”)
添加节点:追加一个子节点(作为最后的子节点)somenode.appendChild(newnode)
把新增的节点放到某个节点的前边:somenode.insertBefore(newnode,某个节点)
删除节点:获取要删除的元素,通过父元素调用该方法删除
somenode.removeChild("要删除的节点")
替换节点:some.node.replateChild(newnode,某个节点)
属性节点:
innerText
innerHTML
setAttribute getAttribute removeAttribute
自带属性可以直接.属性名获取和设置
获取值操作:
elementNode.value 适用于 input select textarea
calss的操作:
classList.remove(cls) 删除指定类
classList.add(cls) 添加类
classList.contains(cls) 存在返回true,否则返回false
calssList.toggle(cls) 存在就删除,否则添加
指定css操作:
obj.style.
对于没有中划线的css属性一般直接使用style.属性名即可
对于有中划线的css属性一般将中划线后的第一个字母换成大写 事件:
HTML中的事件出发浏览器的action
onclick // 点击
ondblclick // 双击
onfocus // 获得焦点
onblur // 失去焦点
onchange // 域的内容被改变
onkeydown // 键盘按键被按下
onkeypress // 键盘按键被按下并且松开
onkeyup // 键盘按键被松开
onload // 完成加载
onmousedown // 鼠标按下
onmousemove // 鼠标被移动
onmouseout // 鼠标从某元素移开
onmouseover // 鼠标在某元素之上
onselect // 文本框中的元素被选中
onsubmit // 确认按钮被点击
js中的BOM和DOM常用事件方法的更多相关文章
- 细看JS中的BOM、DOM对象
DOM对象模型 DOM(Document Object Model),是指文档对象模型,是W3C组织推荐的处理可扩展标志语言的 ...
- js中关于string的一些常用的方法
最近总结了一些关于string中的常用方法, 其中大部分的方法来自于<JavaScript框架设计>这本书, 如果有更好的方法,或者有关于string的别的常用的方法,希望大家不吝赐教. ...
- JS中的call、apply、bind方法
JS中的call.apply.bind方法 一.call()和apply()方法 1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[, [,.argN]]] ...
- 手写面试编程题- 数组去重 深拷贝 获取文本节点 设置奇数偶数背景色 JS中检测变量为string类型的方法 第6题闭包 将两个数组合并为一个数组 怎样添加、移除、移动、复制、创建和查找节点? 继承 对一个数组实现随机排序 让元素水平 垂直居中的三种方式 通过jQuery的extend方法实现深拷贝
第1题==>实现数组去重 通过 new Set(数组名) // var arr = [12, 12, 3, 4, 5, 4, 5, 6, 6]; // var newarr1 = new Set ...
- [转]js中几种实用的跨域方法原理详解
转自:js中几种实用的跨域方法原理详解 - 无双 - 博客园 // // 这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同 ...
- JavaScript中易混淆的DOM属性及方法对比
JavaScript中易混淆的DOM属性及方法对比 ParentNode.children VS Node.prototype.childNodes ParentNode.children:该属性继承 ...
- JavaScript -- 时光流逝(四):js中的 Math 对象的属性和方法
JavaScript -- 知识点回顾篇(四):js中的 Math 对象的属性和方法 1. Math 对象的属性 (1) E :返回算术常量 e,即自然对数的底数(约等于2.718). (2) LN2 ...
- node.js中实现同步操作的3种实现方法
这篇文章主要介绍了node.js中实现同步操作的3种实现方法,本文用实例讲解一些需要同步操作的情况下,如何编程实现,需要的朋友可以参考下 众所周知,异步是得天独厚的特点和优势,但同时在程序中同步的需求 ...
- JS中的forEach、$.each、map方法推荐
下面小编就为大家带来一篇JS中的forEach.$.each.map方法推荐.小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 orEach是ECMA5中Array新方法中最 ...
随机推荐
- ES6深入浅出-13 Proxy 与 Reflect-1.Reflect 反射
阮一峰 http://es6.ruanyifeng.com/#docs/reflect MDN有一些简陋的介绍 https://developer.mozilla.org/zh-CN/docs/We ...
- System.getProperties 获取当前的系统属性
getProperties public static Properties getProperties() 确定当前的系统属性. 首先,如果有安全管理器,则不带参数直接调用其 checkProper ...
- LeetCode_342. Power of Four
342. Power of Four Easy Given an integer (signed 32 bits), write a function to check whether it is a ...
- SqlServer里,一条sql进行递归删除
Server 2005中提供了公用表表达式(CTE),使用CTE,可以使SQL语句的可维护性,同时,CTE要比表变量的效率高得多. 存储过程方法: create proc up_delete_ncla ...
- FreeRTOS 时间片,外部中断,任务优先级的一个疑问
时间片1ms 假设有两个任务,A和B,A任务等待中断里面发出的信号量,B任务在运行 此时,B任务运行了300us的时候中断发生,发出信号量,那么任务A接收到信号量,A任务优先级高,A任务运行 有个问题 ...
- Deep Learning Recommendation Model for Personalization and Recommendation Systems
这篇文章出自facebook,主要探索了如何利用类别型特征(categorical features)并且构建一个深度推荐系统.值得注意的是,文章还特别强调了工业实现上如何实现并行,也很良心地给出了基 ...
- centos7修改yum源为阿里镜像
参考博客: https://blog.csdn.net/kxwinxp/article/details/78578492 https://blog.csdn.net/inslow/article/de ...
- 谈谈redis的热key问题如何解决
引言 讲了几天的数据库系列的文章,大家一定看烦了,其实还没讲完...(以下省略一万字).今天我们换换口味,来写redis方面的内容,谈谈热key问题如何解决.其实热key问题说来也很简单,就是瞬间有几 ...
- java jri null
java通过jri调用r文件,r文件必须和当前类在同一目录下,然后才能re.eval("source(fpath)")执行脚本;其中fpath为通过re.assign设置的文件全路 ...
- IntelliJ IDEA - 查找代码提交人
转载. https://blog.csdn.net/abcyyjjkk/article/details/88995503 如果Annocation不可用