节点属性:

  文档里的每个节点都有以下属性。

  nodeName

  nodeName属性将返回一个字符串,其内容是给定节点的名字:

name = node.nodeName

如果给定节点是一个属性节点,nodeName属性将返回这个属性的名字。

如果给定节点是文本节点,nodeName属性将返回一个内容#text的字符串。

nodeName属性是一个只读属性-----只能对他进行查询,不能进行设置

  • nodeType

nodeType属性将返回一个整数,这个数值代表给定节点类型:

integer = node.nodeType

nodeType属性有2种,nodeType属性所返回的整数值对应着一下12中节点类型之一:

  1. ELEMENT_NODE
  2. ATTRIBUTE_NODE
  3. TEXT_NODE
  4. CDATA_SECTION_NODED等等

在这12种节点类型中,前三种是最重要的,web上的绝大多数DOM脚本都需要与元素节点、属性节点和文本节点打交道。

nodeType属性通常与if语句配合使用,以确保不会再错误的节点类型上执行无效或非法的操作,在下例中,某个函数只有一个名为mynode的参数,这个参数可以是文档中任何一个元素,这个函数将为该元素添加一个取值为this is important的title属性。在此之前,它先检查mynode参数的nodeType属性,以确保这个参数所代表的节点确实是一个元素节点

function addTitle(mynode) {
if ( mynode.nodeTyoe == 1 ) {
mynode.setAttribute("title","this is important");
}
}

nodeType属性是一个只读属性。

  • nodeValue

这个属性将返回一个字符串。

  如果给定节点是属性节点,nodeValue属性将返回这个属性的值

  如果给定的节点是文本节点,nodeValue属性将返回这个文本节点的内容

  如果给定节点是一个元素节点,nodeValue属性将返回null

nodeValue属性是一个读/写属性,不过,你不能对已经定义为null的值进行设置。换句话说,不能为元素节点nodeValue属性设置一个值,

下面的例子将不能工作,因为它试图为一个元素节点设置一个值:

var message = document.getElementById("fineprint");
message.nodeValue = " this won`t work ";

下面的例子有可能可以工作,他试图为一个元素节点的第一个节点设置一个值,只要这个第一个节点是文本节点,新值就能设置成功:

var message = document.getElementById("fineprint");
message.firstChild.nodeValue = "this might work";

下面的例子肯定可以工作,这里增加了一项测试检查fineprint元素节点的第一个子节点是否为文本节点:

var message = document.getElementById("fineprint");
if ( message.firstChild.nodeType == 3 ) {
message.firstChild.nodeValue = "this will work";
}

如果需要刷新某个文本节点的值,nodeValue属性提供了最简单机制,如果需要刷新某个属性节点的值,通过这个属性节点的父节点和setAttribute()方法之间的关系。

DOM属性的更多相关文章

  1. 借助JavaScript中的Dom属性改变Html中Table边框的颜色

    借助JavaScript中的Dom属性改变Html中Table边框的颜色 -------------------- <html> <head> <title>我是页 ...

  2. Js位置与大小(1)——正确理解和运用与尺寸大小相关的DOM属性

    在web开发中,不可避免遇到要计算元素大小以及位置的问题,解决这类问题的方法是利用DOM提供的一些API结合兼容性处理来,所有内容大概分3篇左右的文章的来说明.本文作为第一篇,介绍DOM提供的与尺寸大 ...

  3. HTML DOM 属性 对象

    HTML DOM 属性 对象 HTML DOM 节点 在 HTML DOM (Document Object Model) 中, 所有的都是 节点: 文档是文档节点 所有 HTML 元素是元素节点 所 ...

  4. DOM – (w3school)1.DOM 方法 + 2.DOM属性 + 3.DOM 元素

      1.DOM 方法   一些 DOM 对象方法 这里提供一些您将在本教程中学到的常用方法: 方法 描述 getElementById() 返回带有指定 ID 的元素. getElementsByTa ...

  5. JavaScript 节点操作Dom属性和方法(转)

    JavaScript 节点操作Dom属性和方法   一些常用的dom属性和方法,列出来作为手册用. 属性:   1.Attributes 存储节点的属性列表(只读)   2.childNodes 存储 ...

  6. 【Jquery系列】之DOM属性

    1   概述 本章将结合JQuery官方API,对Jquery属性进行分析与讲解.主要讲.addClass(),.attr(),,hasClass(),,html(),.prop(),.removeA ...

  7. JavaScript中易混淆的DOM属性及方法对比

    JavaScript中易混淆的DOM属性及方法对比 ParentNode.children VS Node.prototype.childNodes ParentNode.children:该属性继承 ...

  8. 使用jQuery匹配文档中所有的li元素,返回一个jQuery对象,然后通过数组下标的方式读取jQuery集合中第1个DOM元素,此时返回的是DOM对象,然后调用DOM属性innerHTML,读取该元素 包含的文本信息

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. jQuery 源码分析(十三) 数据操作模块 DOM属性 详解

    jQuery的属性操作模块总共有4个部分,本篇说一下第2个部分:DOM属性部分,用于修改DOM元素的属性的(属性和特性是不一样的,一般将property翻译为属性,attribute翻译为特性) DO ...

  10. DOM属性获取、设置、删除

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 快速学习ggplot2

    R语言里面一个比较重要的绘图包——ggplot2,是由Hadley Wickham于2005年创建,于2012年四月进行了重大更新,作者目前的工作是重写代码,简化语法,方便用户开发和使用.ggplot ...

  2. 设计模式C++描述----15.策略(Strategy)模式

    一. 举例说明 以前做了一个程序,程序的功能是评价几种加密算法时间,程序的使用操作不怎么变,变的是选用各种算法. 结构如下: Algorithm:抽象类,提供算法的公共接口. RSA_Algorith ...

  3. Oauth 2.0学习

    OAuth是一个关于授权(authorization)的开放网络标准,在全世界得到广泛应用,目前的版本是2.0版. 本文对OAuth 2.0的设计思路和运行流程,做一个简明通俗的解释,主要参考材料为R ...

  4. spring cloud 2.x版本 Ribbon服务发现教程(内含集成Hystrix熔断机制)

    本文采用Spring cloud本文为2.1.8RELEASE,version=Greenwich.SR3 前言 本文基于前两篇文章eureka-server和eureka-client的实现. 参考 ...

  5. 【排列组合】给定一个M*N的格子或棋盘,从左下角走到右上角的走法总数(每次只能向右或向上移动一个方格边长的距离)

    版权声明:本文为CSDN博主「梵解君」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明. 原文链接:https://blog.csdn.net/hadeso/art ...

  6. Windows 10 与 kali 双系统安装

    一.教程中用到的工具如下: 1.kali 2019镜像, 2.U盘 现在最低也有8G吧 3.软碟通 ,U盘刻录工具 4.win 10系统要留出一个空的硬盘,哪个盘的空间比较大可以压缩出大概100G的空 ...

  7. 使用“反向传播”迭代法求解y=√10

    X=√10,求X,也就是求Y=10 =X2 , X是多少. *重要的思想是,如何转化为可迭代求解的算法问题. *解数学问题,第一时间画图,求导,“直线化”. Y = X2 假如已知Y = 10 ,要求 ...

  8. Java迭代Map方法

    Map map=new HashMap(); map.put("1", "one"); map.put("2","two" ...

  9. 星空:差分,状压dp

    总算不再是能用暴力卡常/随机化水过的好T3了. 说是打了两个标签,实际上最关键的是题意转化. 如果你丝毫不转化的话也可以: #include<bits/stdc++.h> using na ...

  10. GitHub_Hexo_Next 搭建博客

    利用最新版本的 hexo+next 重构了个人博客,下面简单记录了搭建博客的完整过程: 一.环境准备 1.安装 Node.js 2.安装 Git 3.注册 Github 账号 二.在GitHub上创建 ...