js中属性节点的应用
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
//关于节点的属性：nodeType,nodeName.nodeValue
//在文档中，任何一个节点都有这三个属性
//而id,name,value是具体节点的属性
window.onload = function(){
//1,元素节点的这三个属性
var bjNode = document.getElementById("bj");
alert(bjNode.nodeType);//元素节点：1
alert(bjNode.nodeName);//节点名：li
alert(bjNode.nodeValue);//元素节点没有nodeValue属性值：null
//2,属性节点
var nameAtr = document.getElementById("name").getAttributeNode("name");
alert(nameAtr.nodeType);//属性节点：2
alert(nameAtr.nodeName);//属性节点的节点名：属性名name
alert(nameAtr.nodeValue);//属性节点的nodeValue属性：属性值username
//3,文本节点
var textNode = bjNode.firstChild;
alert(textNode.nodeType);//文本节点：3
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>lol</li>
</ul>
<br><br>
name:<input type="text" name="username" id ="name" value="你是个傻瓜"/>
</body>
</html>
js中属性节点的应用的更多相关文章
- js中属性类型：数据属性与访问器属性
js中属性类型分为两种:数据属性和访问器属性 在js中,对象都是由名值对构成的,名:就是我们所说的属性名,值就是属性对应的值(基本值.对象.方法). ECMA-262第5版定义了只有内部才用的特性,描 ...
- js中DOM 节点的一些操作方法
什么是DOM DOM:文档对象模型.DOM 为文档提供了结构化表示,并定义了如何通过脚本来访问文档结构.目的其实就是为了能让js操作html元素而制定的一个规范. DOM就是由节点组成的. 解析过程 ...
- JS中"属性"的用法
JS的属性和C#有相似之处 ! 使用get和set来进行属性的获取和设置 var obj={ a:"1", get age(){ return obj.a; }, set age ...
- js中对节点属性的操作和对节点的操作
常用的节点属性操作方法 1.setAttribute(name,value):给某个节点添加一个属性 2.getAttribute(name):获取某个节点属性的值. 3.removeAttribut ...
- js中的节点遍历+类数组对象
firstChild 第一个子元素 lastChild 最后一个子元素 childNodes[n] = childNodes.item(n) 第n+1个子元素 parentNode ...
- js中属性和方法的类型和区别
对象的属性:私有属性(var).类属性(静态属性).对象属性(this).原型属性(prototype). 对象的方法: 私有方法(funtion).类方法(静态方法).对象方法(this).原型方法 ...
- 原生JS中DOM节点相关API合集
节点属性 Node.nodeName //返回节点名称,只读 Node.nodeType //返回节点类型的常数值,只读 Node.nodeValue //返回Text或Comment节点的文本值,只 ...
- JS中Text节点总结
文本节点有Text类型表示,包含的是可以找字面解释的纯文本内容.纯文本中可以包含转移后的HTML字符,但不能包含HTML代码.Text节点具有以下属性: 1.nodeType的值为3. 2.nodeN ...
- JS中Document节点总结
document对象是documentHTML的一个实例,也是window对象的一个属性,因此可以将document对象作为一个全局对象来访问. Document节点的子节点可以是DocumentTy ...
随机推荐
- 未知宽度的div水平居中
淘宝分页: div{position:relative; left:50%; float:left;} p{position:relative; left:-50%;}
- SHELL编写NGINX服务控制脚本
使用源码包安装的Nginx没办法使用"service nginx start"或"/etc/init.d/nginx start"进行操作和控制,所以写了以下的 ...
- win10下的使用
一.win10下使用win7那样的图片查看器快些. 打开图片的设置,关闭自动增强我的图片 二.查看win10秘钥 1.打开注册表,依次定位:HKEY_LOCAL_MACHINE/SOFTWARE/Mi ...
- 关于win7 安装redis的问题
首先在https://github.com/MSOpenTech/redis/releases下载64位的安装包 到任意盘中 将改名为redis 使用cmd命令 启动redis 进入 redis 目录 ...
- 移动Web初级入门
最好的阅读是输出. –玉伯 即将开始涉入移动Web了,有点小兴奋也有点小紧张,希望能在未来的团队里带来一些价值.记录一下我现在所认识的移动Web. 原文摘自我的前端博客,欢迎大家来访问 原文地址:ht ...
- PL/SQL存储过程编程
PL/SQL存储过程编程 /**author huangchaobiao *Email:huangchaobiao111@163.com */ PL/SQL存储过程编程(上) 1. Oracle应用编 ...
- 兼容好的JS图片上传预览代码
转 : http://www.codefans.net/articles/1395.shtml 兼容好的JS图片上传预览代码 (谷歌,IE11) <html xmlns="http:/ ...
- sql server 字符串转成日期格式
在SQL Server数据库中,SQL Server日期时间格式转换字符串可以改变SQL Server日期和时间的格式,是每个SQL数据库用户都应该掌握的.本文我们主要就介绍一下SQL Server日 ...
- 电子线路 PCB 中大电流 接口 和 布线问题；
问题1:电流 大小 和 PCB 中 布线线宽的 关系,电源和信号 稳定性? 问题2:大电流中 接口问题,如microUSB 充电接口中,2A等 快充时接口 会 发热,如果 接口的 布线 太细和 不妥善 ...
- c++文件输入输出流fstream，对输入>>和输出<<重载
1. fstream 继承自iostream --> 要包含头文件#include<fstream> 2. 建立文件流对象 3. 打开文件夹 4. 测试是否打开成功 5. 进行读写操 ...