DOM特性

原创 2017年01月02日 21:26:16

1.访问文档中元素

 (1) document.getElementById('id'):获取给定id的元素,并将其作为对象。

 (2) document.getElementsByTagName('tagname'):获取所有标签名为tagname的元素,并把它保存在一个类似数组的列表中。

2.读取元素的属性、节点值及其他节点数据

 (1) node.getAttribute('attribute'):获取属性名为attribute的值。

 (2) node.setAttribute('attribute',"value"): 设置属性名为attribute的值为value。

 (3) node.nodeType:读取节点类型(1=元素,2=属性节点,3=文本节点)。

 (4) node.nodeName:读取节点名称(元素名称、属性名称和#text等)

 (5) node.nodeValue:读取或设置节点的值(文本节点的情况下则为文本内容)。

3.节点之间操作:

 (1)node.previousSibling:获取上一个兄弟节点,并将它保存为一个对象。

 (2)node.nextSibling:获取下一个兄弟节点,并将它保存为一个对象。

 (3)node.childNodes:获取对象的所有子节点,并把它们存储到一个列表中,对于第一个和最后一个子节点,还可以使用node.firstChild和node.lastChild进行简写。

 (4)node.parentNode:获取包含node的父节点。

4.创建新节点:

 (1)document.createElement(element):创建一个名字为element的新元素。

 (2)document.createTextNode(string):创建一个节点值为string的文本节点。

 (3)newNode=node.cloneNode(bool):创建newNode节点作为node的副本。如果bool值为true,这个副本将包括原节点的所有子节点和属性。

 (4)node.appendChild(newNode):将newNode作为子节点,添加在node所有子节点之后。

 (5)node.insertBefore(newNode,oldNode):在node节点的子节点oldNode之前插入newNode。

 (6)node.removeChild(oldNode):移除node节点的子节点oldNode。

 (7)node.replaceChild(newNode,oldNode):使用节点newNode替换node节点的子节点oldNode。

 (8)element.innerHTML:读写给定element的HTML内容,它是一个字符串。

深入理解DOM节点类型第六篇——特性节点Attribute

前面的话   元素的特性在DOM中以Attr类型表示,从技术角度讲,特性是存在于元素的attributes属性中的节点。尽管特性是节点,但却不是DOM节点树的一部分。本文将详细介绍该部分内容   ...
  • nicexibeidage
  • nicexibeidage
  • 2018年01月04日 14:20
  • 15

DOM_概述&解析特点

DOM |--早期页面都是一些静态的页面,所谓的静态页面,就是页面中又给我们提供了一些相关的资源;我们只要去看就可以了。我们只要点击超链接就可以了; |...
  • java9832
  • java9832
  • 2015年07月19日 00:14
  • 670

dom对象和jquery对象的区别

在开发前台页面的时候,如果要想把页面做的交互性高一些,需要写大量的js代码和css样式.        在js中,获取对象,可以通过 document.getElementById 或 docum...
  • zc474235918
  • zc474235918
  • 2015年12月20日 08:14
  • 1325

JDK5至JDK8的新特性

JDK各个版本的新特性   对于很多刚接触java语言的初学者来说,要了解一门语言,最好的方式就是要能从基础的版本进行了解,升级的过程,以及升级的新特性,这样才能循序渐进的学好一门语...
  • lc0817
  • lc0817
  • 2015年09月03日 16:43
  • 2135

ECMAScript6新特性简介

原文:http://blog.gejiawen.com/2015/07/28/es6-new-feature/ ES6(ECMAScript 6)终于在2015年6月正式发布了。距离上一次正式公...
  • arjick
  • arjick
  • 2016年06月19日 16:38
  • 2892

DOM元素的特性和属性

DOM元素特性和对象属性
  • cheche_carer
  • cheche_carer
  • 2016年07月01日 21:10
  • 500

js学习笔记:DOM2和DOM3(放弃……)

DOM1级主要定义的还是HTML的地层结构,DOM2和DOM3级则在这个结构的基础上引入了更多的交互能力。为此,DOM2和DOM3级分为许多模块,分别描述了DOM的某个非常具体的子集。 DOM2核心:...
  • crystal6918
  • crystal6918
  • 2016年10月24日 17:49
  • 907

jQuery中的DOM操作整理

1.创建元素节点例如,创建两个元素节点,并加入到中 首先创建元素节点var $li_1=$(""); var $li_2=$(""); 然后蒋新创建的节点插入文档中$("ul").append($...
  • wangyun_www
  • wangyun_www
  • 2016年08月18日 10:48
  • 2630

DOM树知识点梳理

为什么会提到Dom树呢,或许它对于我们很好地理解网页各个元素,标签和控件搭配,以及各种js,css等的加载会有一些帮助。笔者在工程中遇到了一些小问题,本质就是dom树的东西掌握的不扎实。所以借此来梳理...
  • ouyangyanlan
  • ouyangyanlan
  • 2015年12月08日 12:25
  • 6225

BOM和DOM详解

DOM是一个使程序和脚本有能力动态地访问和更新文档的内容、结构以及样式的平台和语言中立的接口。,而BOM定义了JavaScript可以进行操作的浏览器的各个功能部件的接口。 js组成 我们都知道...
  • anythings
  • anythings
  • 2016年04月25日 09:54
  • 4678
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:DOM特性
举报原因:
原因补充:

(最多只允许输入30个字)