DOM

作者: _敏讷 | 来源:发表于2017-06-03 16:12 被阅读0次

发现复习DOM最好的方法是学习youmightnotneedjquery.com
可以对原生JS的DOM操作有一个全面的把握

1.元素(element)节点举例:html,head,meta,title,body,div,ul,li,script
2.属性(attr)节点举例:lang,charset,id,class
3.文本(text)节点
4.注释(comment)节点
...

图片.png

创建元素节点
createElement(tagName)
添加子元素
document.body.appendChild(h1)
查找元素
document.getElementById(id)
element.childNodes[i]
element.getEkementByTagName(tagName)
element.getElementByClassName(className)
element.querySelector(query)
element.querySelectorAll(query)
添加/修改文本内容
h1.textContent = "something"
设置类属性
h1.setAttribute("class", "title")
h1.className = "title"
h1.classList.add("title")
h1.classList.remove("title")

DOM事件

鼠标事件
onclick():点击
oncontextmenu():右键打开上下文菜单
ondblclick():双击
onmousedown():按下
onmouseenter():移动到元素上时
onmouseleave():移出元素时
onmousemove():移动
onmouseover():移到元素上
onmouseout():从元素上移开
onmouseup():按键松开

相关文章

  • dom 级别和dom 事件处理

    dom级别:dom0 dom1 dom2 dom3 dom事件处理:dom0 dom2 dom3 (1级DOM标准...

  • WY-DOM编程

    DOM Document Object Model DOM Core DOM HTML DOM Style DOM...

  • DOM事件

    DOM级别与DOM事件 DOM级别:DOM0级、DOM1级、DOM2级、DOM3级DOM事件:DOM0级事件处理、...

  • DOM事件

    DOM级别与DOM事件 DOM级别:DOM0级,DOM1级,DOM2级和DOM3级DOM事件:DOM0级事件处理,...

  • js红包雨活动

    function Block( dom ){ this.dom = dom; //dom this.parentW...

  • DOM操作的分类

    DOM操作分为三个方面,即DOM Core(核心)、HTML-DOM和CSS-DOM。 DOM Core DOM ...

  • 虚拟 DOM 和 diff 算法

    虚拟 DOM(Virtual DOM) 通过 JS 对象表示 DOM 结构,虚拟DOM 是对 DOM 的抽象 通常...

  • jQuery——DOM

    DOM操作分类 一般来说,DOM操作分为3个方面,即DOM Core、HTML-DOM、CSS-DOM。 DOM ...

  • JavaScript高级程序设计前四章

    1. DOM级别 1.1 DOM1级 由DOM核心(DOM Core)和DOM HTML两个模块组成。 DOM核心...

  • DOM分级详解

    DOM1 级(DOM Level 1) DOM1 级由两个模块组成:DOM核心(DOM Core)和DOM HTM...

网友评论

    本文标题:DOM

    本文链接:https://www.haomeiwen.com/subject/kpqmfxtx.html