1.document

document方法
getElementById (Node)返回指定节点的引用
getElementsByTagName (NodeList)返回文档中所有匹配元素的集合
querySelector (Node)返回与选择器匹配的首个节点 (ie8+)
querySelectorAll (Node)返回与选择器匹配的所有节点 (ie8+),其中ie8中选择器只支持css2选择器
createElement(name) (Node)返回新建的节点
createTextNode(text) (Node)返回新建的文本节点
documentElement (Node)返回html节点
body (Node)返回body节点
createDocumentFragment (Node)返回一个DocumentFragment类型的节点,用作一个轻量版本的 Document 使用,用于存储已排好版的或尚未打理好格式的XML片段。

2.node(包括element,text,attribute,document,comment等,Element只是nodeType=1时node)

node方法
appendChild(node) 添加一个子节点
removeChild(node) 移除一个子节点
replaceChilde(node) 替换一个子节点
insertBefore(newNode,refNode) 在同一层级的节点前面插入新节点
hasChildNodes() (Boolean)返回是否子节点
cloneNode(bDeep) (Node)返回节点的副本,bDeep表示是否复制其子节点

node属性
nodeName (String)节点名称
nodeType (Number)节点类型
nodeValue (String)节点的值
parentNode (Node)父节点的引用
childNodes (NodeList)子节点的列表
firstChild (Node)首个子节点
lastChild (Node)最后一个子节点
previouSibling (Node)前一个兄弟节点
nextSibling (Node)后一个子节点

3.element(可以有属性和子节点的node,对应XML中的一个tag元素,继承自node)

element方法
getAttribute(attrName) (string)返回属性的value
setAttribute(attrName,value) (string)给属性赋值
removeAttribue(attrName) (string)删除指定属性
getElementsByTagName(name) (NodeList)返回指定tag的节点列表
querySelector (Node)(ie9+)
querySelectorAll (NodeList)(ie8+)(:scope pseudo-class 不支持)

element属性
children (elementList)返回子元素列表(与子节点有区别,ie9+正确,ie6-8错误的包含Comment类型节点)
previousElementSibling (前一个兄弟element) (ie9+)
nextElementSibling (后一个兄弟element) (ie9+)

element插入文本
element.textContent (IE9+)
element.innerText(ie6+,ff45+,其他浏览器支持)
element.innerHTML(有html parse,性能逊于textContent)

element插入元素,html
//position beforebeigin/afterbegin/beforeend/afterend
element.insertAdjacentHTML(position, html)(全兼容)
element.insertAdjacentElement(position, element)(ie8+,ff48+)

js原生dom方法总结的更多相关文章

  1. 【js常用DOM方法】

    介绍几个js DOM的常用方法 获取元素节点 getElementById  getElementsByTagName  getElementsByClassName 先写一个简单的网页做测试: /* ...

  2. jQuery对象与JS原生dom对象之间的转换

    jQuery就是JS的一个扩展库,工具库,提供很多方便快捷的方法,所以将JS对象转换为jQuery对象后,能更方便地操作这个对象.但是jQuery对象也不是万能的,有一些JS对象有的能,jQuery对 ...

  3. JS原生DOM操作总结

    DOM的主要操作——增.删.改.查节点 (1) 查找节点 document.getElementById('div1') document.getElementsByName('uname') doc ...

  4. js原生removeclass方法

    //如果列表中有存在给定的值就删除 // function removeClass(ele,txt){ // var str = ele.className, // ary = str.split(/ ...

  5. JS获取长度方法总结

    目录: 1length 2size() 3length与size()的区别 4获取元素的索引 - index() 5获取对应的索引 - eq() 概述: 在工作中大家经常需要获取对象的长度,或者要获取 ...

  6. 认识JQuery,JQuery的优势、语法、多库冲突、JS原生对象和JQuery对象之间相互转换和DOM操作,常用的方法

    (一)认识JQuery  JQuery是一个JavaScript库,它通过封装原生的JavaScript函数得到一套定义好的方法    JQuery的主旨:以更少的代码,实现更多的功能 (二)JQue ...

  7. 原生js操作dom的方法

    今天学习了原生js的dom节点的操作,就记录下来,仅供自己以后参考. 1)创建节点:除了可以使用createElement创建元素,也可以使用createTextNode创建文本节点. documen ...

  8. 抛开jQuery,拾起原生JS的DOM操作

    常用的JS-DOM操作与jQuery的对比 jQuery用多了,还是需要来熟练熟练原生JS的操作,不然写JS都快离不开jQuery了 目录 1. 获取DOM 2. 创建DOM 3. 添加DOM 4. ...

  9. 原生js操作DOM基础-笔记

    原文参考http://mp.weixin.qq.com/s?__biz=MzU3MDA0NTMzMA==&mid=2247485490&idx=1&sn=15197b4b53e ...

随机推荐

  1. 安装Nginx服务

    Nginx最大特点: 静态小文件(1M),支持高并发,同时占用系统资源很少.3W并发,10个进程,内存150M. Nginx特点: 1.配置简单,灵活,轻量. 2.高并发(静态小文件),静态几万的并发 ...

  2. Linux设备树语法详解

    概念 Linux内核从3.x开始引入设备树的概念,用于实现驱动代码与设备信息相分离.在设备树出现以前,所有关于设备的具体信息都要写在驱动里,一旦外围设备变化,驱动代码就要重写.引入了设备树之后,驱动代 ...

  3. 用C++开发Binder服务

    用C++来实现Binder服务比较麻烦,原因是没有AIDL的辅助,必须手工来写中间的代码. 首先写一个服务类ExampleServer的代码: class ExampleServer : public ...

  4. [python]获取网页中内容为汉字的字符串的判断

    实际上是这样,将获取到网页中表单内容与汉字字符串作比较,即: a = request.POST['a'] if a == '博客园': print 'ok' else: print 'false' a ...

  5. 【FLUENT案例】05:DDPM模型

    本例利用FLUENT的DDPM模型对提升管进行模拟. 1 介绍 本案例演示在FLUENT中利用稠密离散相模型(Dense discrete phase model,DDPM)模拟2D提升管.DDPM模 ...

  6. 【FLUENT案例】04:利用DDPM+DEM模拟鼓泡流化床

    1 引言2 问题描述3 准备4 FLUENT前处理 1 引言 DEM碰撞模型扩展了DPM模型的功能,能够用于稠密颗粒流动的模拟.该模型可以与DDPM(Dense DPM)模型何用以模拟颗粒对主相的阻碍 ...

  7. AC日记——丑数 codevs 1246

    1246 丑数 USACO  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 钻石 Diamond 题解  查看运行结果     题目描述 Description 对于一给定的素 ...

  8. EL表达式杂项

    1.<%@ page isELIgnored="false" %> 是否忽略EL表达式,如果值为ture,那么  ${..}这样的会直接原样输出,不会进行EL表达式计算 ...

  9. Mongodb数据库学习系列————(一)Mongodb数据库主从复制的搭建

    Mongodb数据库主从复制的搭建 Writeby:lipeng                                    date:2014-10-22 最近项目上用到了位置查询,在网上 ...

  10. C#之发送邮件【模板】+【封装】ZJ版

    PS: 为了弥补上篇博客的不足,正好周六闲着没事.所以进行优化下,来个终结版 功能实现:模板发送+自指定邮箱发送+解耦 总体预览如下: 各代码如下:(代码略多,所以都折叠了) 前台; @{ Layou ...