使用层次关系访问节点

parentNode：返回节点的父节点

childNodes:返回子节点集合，childNodes[i]

firstChild:返回节点的第一个子节点，最普遍的用法是访问该元素的文本节点

firstElementChild:返回节点的第一个元素节点

lastChild:返回节点的最后一个子节点

lastElementChild:返回节点的最后一个子节点的元素节点

nextSibling:下一个节点

previousSibling:上一个节点

setAttribute()设置某个节点的属性值

　　节点对象.setAttribute("属性名","属性值")

getAttribute（）获取某个节点的属性值

　　节点对象.getAttribute("属性名")

例如：

<!DOCTYPE html>
<html lang="en">
<head>
　　<meta charset="UTF-8">
　　<title>node节点</title>
</head>
<script>
　　onload=function(){
　　　　var node1=document.getElementsByTagName("ul")[0];
　　　　//console.log(node1.childNodes);
　　　　node1.setAttribute("xxyy","1122")
　　　　console.log(node1.firstElementChild.getAttribute("xxyy"));
　　}
</script>

<body>
　　<ul>
　　　　<li id="a" xxyy="ooxx">asdf</li>
　　　　<li id="b"></li>
　　　　<li id="c"></li>
　　</ul>
</body>
</html>

javascript 操作节点的属性的更多相关文章

  1. 第四章 JavaScript操作DOM对象

    第四章   JavaScript操作DOM对象 一.DOM操作 DOM是Document Object Model的缩写,即文档对象模型,是基于文档编程的一套API接口,1988年,W3C发布了第一级 ...

  2. JQuery制作网页—— 第三章 JavaScript操作DOM对象

    1. DOM:Document Object Model(文档对象模型):          DOM操作:                   ●DOM是Document Object Model的缩 ...

  3. 使用jQuery快速高效制作网页交互特效-----JavaScript操作DOM对象

    一.DOM操作分类 使用JavaScript操作DOM时通常分为三类:DOM    Core.HTMl--DOM和CSS-DOM 二.访问节点 节点属性 三.节点信息 四.操作节点的属性 语法: ge ...

  4. 第三章 JavaScript操作Dom对象

    常用的方法: 1.访问节点: 通过Document.getElementByXXX()获得一个指定节点-->再通过以下属性节点访问节点:第一部分:节点属性a:parentNode 返回节点的父节 ...

  5. 【转】JavaScript 节点操作 以及DOMDocument属性和方法

    最近发现DOMDocument对象很重要,还有XMLHTTP也很重要 注意大小写一定不能弄错. 属性: 1Attributes 存储节点的属性列表(只读) 2childNodes 存储节点的子节点列表 ...

  6. 初探JavaScript（一）——也谈元素节点、属性节点、文本节点

    Javascript大行其道的时候,怎么能少了我来凑凑热闹^_^ 基本上自己对于js的知识储备很少,先前有用过JQuery实现一些简单功能,要论起JS的前世今生,来龙去脉,我就一小白.抱起一本< ...

  7. 使用JavaScript操作DOM节点元素的常用方法(创建/删除/替换/复制等)

    getElementById(id)这是通过id来访问某一元素,最常用的之一,例:<html><body><div id="myid">test ...

  8. javascript操作DOM的方法与属性

    文档对象模型DOM(Document Object Model)定义访问和处理HTML文档的标准方法.DOM 将HTML文档呈现为带有元素.属性和文本的树结构. 将HTML代码分解为DOM节点层次图: ...

  9. JavaScript的DOM操作(节点操作)

    创建节点createElement()var node = document.createElement(“div”);没什么可说的,创建一个元素节点,但注意,这个节点不会被自动添加到文档(docum ...

随机推荐

  1. No space left on device Linux系统磁盘空间已满

    1. 删除系统日志等   删除生成 core,mbox等文件   #find / -name core|xargs rm –rf   删除日志   2.重起机器

  2. Laravel 1071 Specified key was too long

    出现错误 SQLSTATE[42000]: Syntax error or access violation: 1071 Specified key was too long; max key len ...

  3. MySql5.5安装详细说明

      双击MySql5.5安装文件开始: next 打勾,Next 选Custom,原因如下面所述: Typical(典型安装) Installs the most common program fea ...

  4. java的基础数据类型

    Java 里面的数据类型从大的方面分为两类,一是基本数据类型,一是引用类型.基本的JAVA 数据类型层次图如下: Java 中的基本数据类型可分为四种:(1)逻辑型:boolean(2)文本型:cha ...

  5. CXF 简单创建Webserver 例子

    最近在弄webserver,因为公司需要用到,来说说,webserver的常用方式吧 1.什么是webservice 1.1   什么是远程调用技术 远程调用数据定义:是系统和系统之间的调用 先说一说 ...

  6. 详解angular2组件中的变化检测机制（对比angular1的脏检测）

    组件和变化检测器 如你所知,Angular 2 应用程序是一颗组件树,而每个组件都有自己的变化检测器,这意味着应用程序也是一颗变化检测器树.顺便说一句,你可能会想.是由谁来生成变化检测器?这是个好问题 ...

  7. PTA-栈（括弧匹配）

    #include<bits/stdc++.h> using namespace std; #define STACK_INIT_SIZE 10000 #define STACKINCREM ...

  8. windows中obs源码编译的坑

    好用的版本: cmake-3.6.1-win64-x64  +  vs2015  + qt-opensource-windows-x86-msvc2015_64-5.7.0   +   obs-stu ...

  9. Python_随机序列生成_白噪声

    本文介绍如何利用Python自行生成随机序列,实现了 Whichmann / Hill 生成器. 参考: [1]Random Number Generation and Monte Carlo Met ...

  10. [C# 基础知识系列]专题七: 泛型深入理解(一) （转载）

    引言: 在上一个专题中介绍了C#2.0 中引入泛型的原因以及有了泛型后所带来的好处,然而上一专题相当于是介绍了泛型的一些基本知识的,对于泛型的性能为什么会比非泛型的性能高却没有给出理由,所以在这个专题 ...