Javascript的DOM操作

Javascript的DOM操作

1.訪问节点
document.getElementById(id);
返回对拥有指定id的第一个对象进行訪问

document.getElementsByName(name);
返回带有指定名称的节点集合
注意:Elements

document.getElementsByTagName(tagname);
返回带有指定标签名的对象集合
注意:Elements

document.getElementsByClassName(classname);
返回带有指定class名称的对象集合
注意:Elements

2.生成节点
document.createElement(eName);
创建一个节点

document.createAttribute(attrName);
对某个节点创建属性

document.createTextNode(text);
创建文本节点

3.加入�节点
document.insertBefore(newNode,referenceChild);
在某个节点前插入节点

parentNode.appendChild(newNode);
给某个节点加入�子节点

4.复制节点
cloneNode(true | false);
复制某个节点
參数:是否复制原节点的全部属性

5.删除节点
parentNode.removeChild(node)
删除某个节点的子节点
node是要删除的节点
注意:IE会忽略节点间生成的空白文本节点(比如,换行符号),而Mozilla不会这样做。在删除指定节点的时候不会出错,可是假设要删除最后一个子结点或者是第一个子结点的时候,就会出现故障。这时候,就须要用一个函数来推断首个子结点的节点类型。
元素节点的节点类型是 1,因此假设首个子节点不是一个元素节点,它就会移至下一个节点,然后继续检查此节点是否为元素节点。整个过程会一直持续到首个元素子节点被找到为止。通过这种方法,我们就能够在 Internet Explorer 和 Mozilla 得到正确的方法。

6.改动文本节点
appendData(data);
将data加到文本节点后面

deleteData(start,length);
将从start处删除length个字符

insertData(start,data)
在start处插入字符,start的開始值是0;

replaceData(start,length,data)
在start处用data替换length个字符

splitData(offset)
在offset处切割文本节点

substringData(start,length)
从start处提取length个字符

7.属性操作
getAttribute(name)
通过属性名称获取某个节点属性的值

setAttribute(name,value);
改动某个节点属性的值

removeAttribute(name)
删除某个属性

8.查找节点
parentObj.firstChild
假设节点为已知节点的第一个子节点就能够使用这种方法。此方法能够递归进行使用
parentObj.firstChild.firstChild…..

parentObj.lastChild
获得一个节点的最后一个节点,与firstChild一样也能够进行递归使用
parentObj.lastChild.lastChild…..

parentObj.childNodes
获得节点的全部子节点,然后通过循环和索引找到目标节点

9.获取相邻的节点
neborNode.previousSibling :获取已知节点的相邻的上一个节点
nerbourNode.nextSlbling: 获取已知节点的下一个节点

10.获取父节点
childNode.parentNode:得到已知节点的父节点

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/119062.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • Mac 键盘快捷键

    Mac 键盘快捷键Mac键盘快捷键您可以按下组合键来实现通常需要鼠标、触控板或其他输入设备才能完成的操作。要使用键盘快捷键,请按住一个或多个修饰键,同时按快捷键的最后一个键。例如,要使用快捷键Command-C(拷贝),请按住Command键并按C键,然后同时松开这两个键。Mac菜单和键盘通常对某些按键使用符号,其中包括以下修饰键:Command⌘Shift⇧Option⌥Con…

    2022年5月16日
    38
  • 用户态和内核态的简单理解「建议收藏」

    用户态和内核态的简单理解「建议收藏」文章目录linux基础系统调用和库函数的区别什么是用户态和内核态用户态和内核态的相互转换linux基础linux的kernel内核外是系统调用,系统调用外是shell、库函数系统调用和库函数的区别内核:屏蔽了调用各硬件资源的细节系统调用:内核提供给用户调用的接口,但系统调用的可移植性差移植性差的原因:windows、linux内核的系统调用是不同的,比如:同一个功能提供给用户的函数名、参数都不相同,会出现从一个系统移植到另一个系统无法正常运行。库函数:为了解决系统调用移植新差的问题,同时封

    2022年9月18日
    1
  • 数据库置疑修复_sqlserver错误日志在哪里

    数据库置疑修复_sqlserver错误日志在哪里这篇文章在我电脑上呆得太久了,也不知道还有没有用

    2022年8月20日
    10
  • windows 10安装sqlyog详细步骤

    windows 10安装sqlyog详细步骤sqlyog下载链接:链接:https://pan.baidu.com/s/1D_iRna8V90omfHsKHyeBtg提取码:bqht复制这段内容后打开百度网盘手机App,操作更方便哦1.下载完以后解压,双击SQLyog-12.0.9-0.x642.如下图,选择Ok3.如图,点击下一步4.选择“我接受“许可证协议”中的条款(A)”单击下一步…

    2022年5月28日
    76
  • golang 2021最新激活码[在线序列号]

    golang 2021最新激活码[在线序列号],https://javaforall.net/100143.html。详细ieda激活码不妨到全栈程序员必看教程网一起来了解一下吧!

    2022年3月20日
    76
  • 用Java IO流实现下载文件

    用Java IO流实现下载文件  @RequestMapping(value="download")   publicStringdownload(HttpServletResponseresponse,Modelmodel){             //通过文件名找出文件的所在目录      StringURL="D:/one/two.txt";      //得到要下载的文件…

    2022年5月30日
    44

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号