• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号
您的位置:首页 > 程序设计 >JavaScript > 基本DOM节点操作

基本DOM节点操作

作者:sharminKid 字体:[增加 减小] 来源:互联网 时间:2017-05-11

sharminKid通过本文主要向大家介绍了dom节点操作,jquery操作dom节点,dom节点,dom节点类型,什么是dom节点等相关知识,希望对您有所帮助,也希望大家支持linkedu.com www.linkedu.com

1、获取元素节点

getElementById():获取指定唯一id的元素。

getElementByTagName():获取指定元素标签名的元素数组。

getElementByName():获取具有指定属性name的元素数组。

2、子节点

element.childNodes:返回该元素的子节点数组。注意:换行在浏览器中作为text节点,需要进行过滤

element.firstChild:该元素的第一个子节点。

element.lastChild:该元素最后一个子节点。

3、父节点

element.parentNode

4、兄弟节点

element.previousSibling:返回相同的树层级中的前一个节点,如果没有,则为null

element.nextSibling:返回相同的树层级中的后一个节点,如果没有,则为null

5、创建节点

createElement() 按指定标签名创建节点

6、复制节点

clonedNode = Node.cloneNode(boolean) 传入布尔值,true表示复制该节点下的所有子节点

7、加入节点

parentNode.appendChild(childNode) 将新节点加入到子节点末尾

parentNode.insertBefore(newNode, targetNode) 将newNode 加入到targNode之前

8、移除目标节点

parentNode.removeChild(childNode)

9、替换目标节点

parentNode.replace(newNode, targetNode) 使用newNode 替换targetNode

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持!

</div>
分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • jacascript DOM节点——元素节点、属性节点、文本节点
  • 老生常谈jacascript DOM节点获取
  • 基本DOM节点操作

相关文章

  • 2017-05-11详解javascript中对数据格式化的思考
  • 2017-05-11Angularjs处理页面闪烁的解决方法
  • 2017-05-11轻松学习Javascript闭包
  • 2017-05-11JavaScript判断浏览器及其版本信息
  • 2017-05-11从零学习node.js之express入门(六)
  • 2017-05-11进阶之初探nodeJS
  • 2017-05-11原生js实现新闻列表展开/收起全文功能
  • 2017-05-11jQuery实现的简单排序功能示例【冒泡排序】
  • 2017-05-11浅谈jQuery的bind和unbind事件(绑定和解绑事件)
  • 2017-05-11AngularJS实现使用路由切换视图的方法

文章分类

  • JavaScript
  • ASP.NET
  • PHP
  • 正则表达式
  • AJAX
  • JSP
  • ASP
  • Flex
  • XML
  • 编程技巧
  • Android
  • swift
  • C#教程
  • vb
  • vb.net
  • C语言
  • Java
  • Delphi
  • 易语言
  • vc/mfc
  • 嵌入式开发
  • 游戏开发
  • ios
  • 编程问答
  • 汇编语言
  • 微信小程序
  • 数据结构
  • OpenGL
  • 架构设计
  • qt
  • 微信公众号

最近更新的内容

    • JavaScript中的Cookie
    • MUI Scroll插件的使用详解
    • 浅谈JavaScript正则表达式-非捕获性分组
    • jquery实现焦点轮播效果
    • js实现简单的二级联动效果
    • JS获取鼠标位置距浏览器窗口距离的方法示例
    • localStorage的黑科技-js和css缓存机制
    • Canvas + JavaScript 制作图片粒子效果
    • 原生JS实现幻灯片
    • 基于MVC方式实现三级联动(JavaScript)

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有