DOM属性
节点属性:
文档里的每个节点都有以下属性。
nodeName
nodeName属性将返回一个字符串,其内容是给定节点的名字:
name = node.nodeName
如果给定节点是一个属性节点,nodeName属性将返回这个属性的名字。
如果给定节点是文本节点,nodeName属性将返回一个内容#text的字符串。
nodeName属性是一个只读属性-----只能对他进行查询,不能进行设置
- nodeType
nodeType属性将返回一个整数,这个数值代表给定节点类型:
integer = node.nodeType
nodeType属性有2种,nodeType属性所返回的整数值对应着一下12中节点类型之一:
- ELEMENT_NODE
- ATTRIBUTE_NODE
- TEXT_NODE
- 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属性的更多相关文章
- 借助JavaScript中的Dom属性改变Html中Table边框的颜色
借助JavaScript中的Dom属性改变Html中Table边框的颜色 -------------------- <html> <head> <title>我是页 ...
- Js位置与大小(1)——正确理解和运用与尺寸大小相关的DOM属性
在web开发中,不可避免遇到要计算元素大小以及位置的问题,解决这类问题的方法是利用DOM提供的一些API结合兼容性处理来,所有内容大概分3篇左右的文章的来说明.本文作为第一篇,介绍DOM提供的与尺寸大 ...
- HTML DOM 属性 对象
HTML DOM 属性 对象 HTML DOM 节点 在 HTML DOM (Document Object Model) 中, 所有的都是 节点: 文档是文档节点 所有 HTML 元素是元素节点 所 ...
- DOM – (w3school)1.DOM 方法 + 2.DOM属性 + 3.DOM 元素
1.DOM 方法 一些 DOM 对象方法 这里提供一些您将在本教程中学到的常用方法: 方法 描述 getElementById() 返回带有指定 ID 的元素. getElementsByTa ...
- JavaScript 节点操作Dom属性和方法(转)
JavaScript 节点操作Dom属性和方法 一些常用的dom属性和方法,列出来作为手册用. 属性: 1.Attributes 存储节点的属性列表(只读) 2.childNodes 存储 ...
- 【Jquery系列】之DOM属性
1 概述 本章将结合JQuery官方API,对Jquery属性进行分析与讲解.主要讲.addClass(),.attr(),,hasClass(),,html(),.prop(),.removeA ...
- JavaScript中易混淆的DOM属性及方法对比
JavaScript中易混淆的DOM属性及方法对比 ParentNode.children VS Node.prototype.childNodes ParentNode.children:该属性继承 ...
- 使用jQuery匹配文档中所有的li元素,返回一个jQuery对象,然后通过数组下标的方式读取jQuery集合中第1个DOM元素,此时返回的是DOM对象,然后调用DOM属性innerHTML,读取该元素 包含的文本信息
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery 源码分析(十三) 数据操作模块 DOM属性 详解
jQuery的属性操作模块总共有4个部分,本篇说一下第2个部分:DOM属性部分,用于修改DOM元素的属性的(属性和特性是不一样的,一般将property翻译为属性,attribute翻译为特性) DO ...
- DOM属性获取、设置、删除
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
随机推荐
- SOLID原则、设计模式适用于Python语言吗
在阅读 clean architecture的过程中,会发现作者经常提到recompile redeploy,这些术语看起来都跟静态类型语言有关,比如Java.C++.C#.而在我经常使用的pytho ...
- spring boot项目启动报错
在eclipse中运行没有任何问题,项目挪到idea之后就报错 Unable to start EmbeddedWebApplicationContext due to miss EmbeddedSe ...
- Django学习day4——视图和URL配置
创建一个简单的hello world 在day3中我们第一次运行了服务器,里面是一个django的欢迎页面,那是因为我们没有配置URL和视图,django在底层会自动跳转这个页面上 我们在mysite ...
- [考试反思]0907NOIP模拟测试39:角落
题比较简单,但是做的非常烂. T1是个愚蠢的找规律组合数快速幂,数组开小了(看错数据范围) T2题目保证联通没看见,hack掉了正解. T3也挺蠢的,但是打乱了,思路不是很清晰导致丢了50分. 只能说 ...
- CSPS模拟 86
看见异或两个字就孩怕 T1 按位? T2 这道异或稍水啊233 貌似可以打表找找规律 emm七种转移,有重复刷表 优化一下? T3 skyh已经接了2杯水了(实际情况他已经ak了) cbx开始抬头傻笑 ...
- windows下载安装swoole的方法
windows下载安装swoole的方法先安装Cygwin 选择163镜像(速度非常快) add url http://mirrors.163.com/cygwin/ 然后安装gcc php pcre ...
- 010.Kubernetes二进制部署kube-controller-manager
一 部署高可用kube-controller-manager 1.1 高可用kube-controller-manager介绍 本实验部署一个三实例 kube-controller-manager 的 ...
- 03-MyBatis拦截器机制
目录 MyBatis拦截器介绍 拦截器的使用 拦截器介绍及配置 源码分析 总结 本文转载自MyBatis拦截器原理探究 MyBatis拦截器介绍 MyBatis提供了一种插件(plugin)的功能,虽 ...
- SpEL + AOP实现注解的动态赋值
一.自定义注解 先聊聊这个需求,我需要根据用户的权限对数据进行一些处理,但是痛点在哪里呢?用户的权限是在请求的时候知道的,我怎么把用户的权限传递给处理规则呢?想了以下几种方案: Mybatis 拦截器 ...
- 面试官问我:谈谈对Java GC的了解?回答完让我回家等消息....
JVM的运行数据区 首先我简单来画一张 JVM的结构原理图,如下. 我们重点关注 JVM在运行时的数据区,你可以看到在程序运行时,大致有5个部分. 1.方法区 不止是存“方法”,而是存储整个 clas ...