访问 HTML中元素的方法
http://www.w3school.com.cn/jsref/index.asp
1.document.getElementbyId(“id1”),Html中,名称是id1的元素的对象。由于要求元素的id是唯一的,所以通过getElementId()方法获得的是一个对象,而不是一个数组。
2.document.getElementbyTagName("h1"),返回所有标签为<h1>的对象的集合(他的返回值是一个数组,包括了所有标签是<h1>的集合),如果要查看当前html中有多少个<h1>元素,可以使用document.getElementbyTagName("h1").length,来获得。如果想获得特定的<h1>元素,可以通过document.getElementbyTagName("h1")[0]来获得。另外getElementbyTagName不仅仅是document的方法,也可以是其他元素的方法,表示获得其他元素内部的指定标签的元素。比如,var eventList= docuement.getElementbyId("EventList");//得到Html中id 为EventList的元素,
var li1 = eventList.getElementbyTagName("li")[0]得到 eventList标签中包含的第一个<li>标签。
3.文档的重要属性:在文档中每个节点都有一些重要的属性,最重要的是
(1).nodeType(它用来描述该节点是什么),比如这个节点是一个元素类型的节点(p,h1,li)等等,或者是一个文本(text)类型的节点,比如<h1 id=”title1”>我是标题</h1>。*当节点是元素节点时,Element.nodeType的返回值是 1;如果节点是文本类型节点时,返回值是 3;
(2).nodeName,表示的是元素的名字,比如在<body>中定义了一个<TextArea id=”myText”>元素,如果用 var myNodeName = document.getElementbyId(“myText”).nodeName;返回值是”TextArea”.
(3)nodeValue是节点的值,如果节点是一个元素,则它的nodeValue是null,如果nodeValue是文本节点,则他的值是文本的内容。
4.父节点,子节点,兄弟节点之间的访问:
(1)从父节点访问子节点:(a).yourElement.childNodes(),这是访问该父节点下面的所有子节点,返回值是一个节点的数组(NodeList)。需要取到某一个的时候,可以用[1]类似的索引取到,还可以用数组的属性取到子节点的个数等等。
(b).firstChild,lastChild顾名思义了,不多解释,但是有一点,一个节点的属性,比如nodeType,nodeName,nodeValue等等都被看成是它的子节点,所以要访问这些属性的时候,getElementbyId(“aaa”).nodeType是访问不到的,需要用 getElementbyId[“aaa”].firstChild.nodeType,才可以访问。
(2)从子节点访问父节点:parentNode,可以利用循环访问父节点
例:while(parentElm.className !=‘dynamic’&& parentElm !=’document.body’)
{
parentElm=parentElm.parentNode;
}
(3)兄弟节点之间的访问:可以使用element.previousSibling和element.nextSibling属性,访问当前节点的上一个兄弟节点和下一个兄弟节点。
5.JavaScript中访问Html标签属性的方法:
(1)用getElementById(“”)等取得节点的方法得当标签,然后 .【属性】就可以,例如:getElementsByTagName(“A”)[0].href = “color.htm”
(2)用getElementById(“”)等取得节点的方法得到标签,然后用getAttribute 或者 setAttribute设置属性值。
6.创建新节点
document.createElement(element):创建一个名字为element的新元素,需要提供一个字符串形式的元素名。
document.createTextNode(“string”):创建一个节点值为string的文本节点。
newNode = node.cloneNode(bool):创建newNode节点作为Node的副本(clone)
node.appendChild(newNode):将newNode作为子节点,添加在node所有子节点后。
node.insertBefore(newNode,oldNode):在node节点的子节点oldNode之前插入newNode.
node.removeChild(oldNode):移除node节点的子节点oldNode

访问 HTML中元素的方法的更多相关文章
- JAVA中循环删除list中元素的方法总结【转】
印象中循环删除list中的元素使用for循环的方式是有问题的,但是可以使用增强的for循环,然后今天在使用时发现报错了,然后去科普了一下,再然后发现这是一个误区.下面就来讲一讲..伸手党可直接跳至文末 ...
- java中循环删除list中元素的方法
重点哈 印象中循环删除list中的元素使用for循环的方式是有问题的,但是可以使用增强的for循环,然后今天在使用时发现报错了,然后去科普了一下,再然后发现这是一个误区.下面就来讲一讲..伸手党可直接 ...
- javascript 获取父页面中元素对象方法
父页面中: <input type="hidden" id="areaID" value="test1"> <iframe ...
- Java中循环删除list中元素的方法总结
印象中循环删除list中的元素使用for循环的方式是有问题的,但是可以使用增强的for循环,然后在今天使用的时候发现报错了,然后去科普了一下,发现这是一个误区.下面我们来一起看一下. Java中循环遍 ...
- js删除数组中元素的方法
一.清空数组 var ary = [1,2,3,4]; ary.splice(0,ary.length);//清空数组 console.log(ary); // 输出 [],空数组,即被清空了 二.删 ...
- python删除列表中元素的方法
删除列表中元素的三种方法-remove.pop.del 1 1.remove: 删除单个元素,删除首个符合条件的元素,按值删除 2 举例说明: 3 >>> str=[1,2,3,4, ...
- JS实现循环删除数组中元素的方法介绍
这篇文章主要给大家介绍了关于Javascript循环删除数组中元素的几种方法,文中给出了详细的示例代码供大家参考学习,对大家具有一定的参考学习价值,需要的朋友们下面来一起看看吧. 本文主要跟大家分享了 ...
- JAVA中循环删除list中元素的方法总结(同上篇)
印象中循环删除list中的元素使用for循环的方式是有问题的,但是可以使用增强的for循环,然后今天在使用时发现报错了,然后去科普了一下,再然后发现这是一个误区.下面就来讲一讲..伸手党可直接跳至文末 ...
- vue学习(五) 访问vue内部元素或者方法
//html <div id="app"> <input type="button" value="ok" v-bind: ...
随机推荐
- (转载)JDK中的设计模式
写的很好,学习道路更轻松一些 原文地址:http://blog.csdn.net/gtuu0123/article/details/6114197 JDK中设计模式 分类: Java相关 设计模式 2 ...
- 单调栈 二 nyOj 最大矩形和
主要思想来自 http://blog.csdn.net/wuyanyi/article/details/7243580 题目的连接,头次提交的同学需要注册 http://acm.nyist.net/J ...
- NOIP 2015 子串
借鉴大神思路... #include<cstdio> #include<cstring> #include<cstdlib> #include<iostrea ...
- 关于VNC黑屏的问题
注意: 1.vncserver启动后生成的ID号(1,2,3)要和VNCview里面填入的 ip:ID要保持一致 不然看到的就是黑屏 比如:vncserver启动后 产生: localhost.lo ...
- [读书笔记]算法(Sedgewick著)·第二章.初级排序算法
本章开始学习排序算法 1.初级排序算法 先从选择排序和插入排序这两个简单的算法开始学习排序算法.选择排序就是依次找到当前数组中最小的元素,将其和第一个元素交换位置,直到整个数组有序. public s ...
- sudo 和 sudoers设置
转: http://www.cnblogs.com/zhuowei/archive/2009/04/13/1435190.html sudo是linux下常用的允许普通用户使用超级用户权限的工具,允许 ...
- Linux的五个查找命令:find,locate,whereis,which,type
使用电脑的时候,经常需要查找文件. 在Linux中,有很多方法可以做到这一点.国外网站LinuxHaxor总结了五条命令,你可以看看自己知道几条.大多数程序员,可能经常使用其中的2到3条,对这5条命令 ...
- CSS 中常用的选择器(选择符)
一.标签选择器:直接将HTML标签(Tag)作为选择器,可以是p.h1.dl.strong等HTML标签.如: p { font:12px;}em { color:blue;}dl { float:l ...
- FFT(快速傅立叶算法 for java)
package com.test.test2; public class FFT { public static final int FFT_N_LOG = 10; // FFT_N_LOG ...
- Microsoft.Net中数字签名技术
概 述:本文以Microsoft.Net中创建签名的CAB文件为例,说明如何创建签名文件,从而使你的代码能够安全的在INTERNET上公布.希望能起到抛转引玉的作用. keyword:数字签名,Act ...