节点的属性:
1). nodeName: 代表当前节点的名字. 只读属性.
　　如果给定节点是一个文本节点, nodeName 属性将返回内容为 #text 的字符串
2). nodeType：返回一个整数, 这个数值代表着给定节点的类型.
只读属性. 1 -- 元素节点, 2 -- 属性节点, 3 -- 文本节点
3). nodeValue：返回给定节点的当前值(字符串). 可读写的属性
①. 元素节点, 返回值是 null.
②. 属性节点: 返回值是这个属性的值
③. 文本节点: 返回值是这个文本节点的内容

 <html>

     <head>

         <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

         <title>Untitled Document</title>

         <script type="text/javascript">

             //关于节点的属性: nodeType, nodeName, nodeValue

             //在文档中, 任何一个节点都有这 3 个属性

             //而 id, name, value 是具体节点的属性.

             window.onload = function(){

                 //1. 元素节点的这 3 个属性

                 var bjNode = document.getElementById("bj");

                 alert(bjNode.nodeType); //元素节点: 1

                 alert(bjNode.nodeName); //节点名: li

                 alert(bjNode.nodeValue); //元素节点没有 nodeValue 属性值: null

                 //2. 属性节点

                 var nameAttr = document.getElementById("name")

                                        .getAttributeNode("name");

                 alert(nameAttr.nodeType); //属性节点: 2

                 alert(nameAttr.nodeName); //属性节点的节点名: 属性名

                 alert(nameAttr.nodeValue); //属性节点的 nodeValue 属性值: 属性值

                 //3. 文本节点:

                 var textNode = bjNode.firstChild;

                 alert(textNode.nodeType); //文本节点: 0

                 alert(textNode.nodeName); //节点名: #text

                 alert(textNode.nodeValue); //文本节点的 nodeValue 属性值: 文本值本身. 

                 //nodeType、nodeName 是只读的.

                 //而 nodeValue 是可以被改变的。

                 //以上三个属性, 只有在文本节点中使用 nodeValue 读写文本值时使用最多.

             }

         </script>

     </head>

     <body>

         <p>你喜欢哪个城市?</p>

         <ul id="city">

             <li id="bj" name="BeiJing">北京</li>

             <li>上海</li>

             <li>东京</li>

             <li>首尔</li>

         </ul>

         <br><br>

         <p>你喜欢哪款单机游戏?</p>

         <ul id="game">

             <li id="rl">红警</li>

             <li>实况</li>

             <li>极品飞车</li>

             <li>魔兽</li>

         </ul>

         <br><br>

         name: <input type="text" name="username"

             id="name" value="atguigu"/>

     </body>

 </html>

JavaScript的DOM编程--07--节点的属性的更多相关文章

  1. javascript之DOM编程设置节点插入节点

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

  2. HTML、css、javascript、DOM编程

    HTML.css.javascript.DOM编程 一.Html 1.1html概述 Html就是超文本标记语言的简写,是最基础的网页语言,其代码都是由标签所组成,是通过标签来定义的语言,代码不需要区 ...

  3. DOM中元素节点、属性节点、文本节点的理解

    DOM中元素节点.属性节点.文本节点的理解 节点信息 每个节点都拥有包含着关于节点某些信息的属性.这些属性是:nodeName(节点名称) nodeValue(节点值) nodeType(节点类型)  ...

  4. JavaScript的DOM编程--03--读写属性节点

    读写属性节点: 1)可以直接通过 cityNode.id 这样的方式来获取和设置属性节点的值 2)通过元素节点的 getAttributeNode 方法来获取属性节点, 然后在通过 nodeValue ...

  5. JavaScript的DOM编程--12--innerHTML属性

    innerHTML属性: 1). 浏览器几乎都支持该属性, 但不是 DOM 标准的组成部分. innerHTML 属性可以用来读, 写某给定元素里的 HTML 内容 <html> < ...

  6. JavaScript的DOM编程--02--获取元素节点

    如何来获取元素节点: 1) .document.getElementById: 根据 id 属性获取对应的单个节点 2) .document.getElementsByTagName: 根据标签名获取 ...

  7. 高性能Javascript(2) DOM编程

    第三部分 DOM编程 文档对象模型(DOM)是一个独立于语言的,使用XML和HTML文档操作的应用程序接口(API).在浏览器中,主要与HTML文档打交道,在网页应用中检索XML文档也很常见.DOM ...

  8. DOM中元素节点、属性节点、文本节点

    DOM中有12中节点,但最常用到的是元素节点,属性节点,文本节点. 元素节点的节点类型(nodeType)是1: 属性节点的节点类型(nodeType)是2: 文本节点的节点类型(nodeType)是 ...

  9. 高性能JavaScript之DOM编程

    我们知道.DOM是用于操作XML和HTML文档的应用程序接口,用脚本进行DOM操作的代价非常昂贵. 有个贴切的比喻.把DOM和JavaScript(这里指ECMScript)各自想象为一个岛屿,它们之 ...

随机推荐

  1. MySQL服务找不到了，navicat打不开数据库连接

    今天打开Navicat看看连接名,突然发现连接不上了,打开服务发现MySQL服务不见了,所以手动安装了遍MySQL服务. 详细步骤如下: 1.管理员身份打开cmd,切换到MySQL安装目录下的bin目 ...

  2. CCF-201512-3-画图

    问题描述 试题编号: 201512-3 试题名称: 画图 时间限制: 1.0s 内存限制: 256.0MB 问题描述: 问题描述 用 ASCII 字符来画图是一件有趣的事情,并形成了一门被称为 ASC ...

  3. Python面向对象解析

    面向对象概述 什么是面向对象:从简单来说,如果程序中的所有功能都是用 类 和 对象 来实现,那么就是面向对象编程了. 面向过程:根据业务逻辑从上到下写垒代码 函数式:将某功能代码封装到函数中,日后便无 ...

  4. CDH集群搭建部署

    1. 硬件准备     使用了五台机器,其中两台8c16g,三台4c8g.一台4c8g用于搭建cmServer和NFS服务端,另外4台作为cloudera-manager agent部署CDH集群. ...

  5. C# httpclient获取cookies实现模拟web登录

    目前在公司做一款平台化的产品,我主要负责PC端上的开发,在产品推荐过程中为了节省开发时间很多功能模块没来得及做原生,用CEF嵌入了很多带功能web页面,与客户端进行交互从而实现功能. 在二期开发中,产 ...

  6. Android IntentService的使用和源码分析

    引言 Service服务是Android四大组件之一,在Android中有着举足重轻的作用.Service服务是工作的UI线程中,当你的应用需要下载一个文件或者播放音乐等长期处于后台工作而有没有UI界 ...

  7. Python爬虫(十一)_案例：使用正则表达式的爬虫

    本章将结合先前所学的爬虫和正则表达式知识,做一个简单的爬虫案例,更多内容请参考:Python学习指南 现在拥有了正则表达式这把神兵利器,我们就可以进行对爬取到的全部网页源代码进行筛选了. 下面我们一起 ...

  8. 海量服务实践──手 Q 游戏春节红包项目设计与总结（上篇）

    导语 大哥说.今年手Q游戏的春节红包你来做.那该怎么做?以及怎么做才干让大哥放心?本文从后台的角度出发讲述了这个过程和方法.对于关键的前台部分也有所涉及. 文件夹 1.需求背景 1.1.红包类别 1. ...

  9. 自学Zabbix3.5.5-监控项item-User parameters（自定义key）

    为什么要自定义KEY,即User parameters功能 有时候我们想让被监控端执行一个zabbix没有预定义的检测,zabbix的用户自定义参数功能提供了这个方法.我们可以在客户端配置文件zabb ...

  10. 项目实战12.2—企业级监控工具应用实战-zabbix操作进阶

    无监控,不运维.好了,废话不多说,下面都是干货. 流量党勿入,图片太多!!! 项目实战系列,总架构图 http://www.cnblogs.com/along21/p/8000812.html 一.U ...