dom的知识学习

于 2022-05-10 19:27:08 发布
阅读量150 收藏
点赞数
文章标签： 学习 javascript 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Gnaf12345/article/details/124695273
版权

dom的结构是树形结构，可以嵌套

DOM的操作：

  • 增
  1. function createElement()  创建元素节点
  2. function setAtrribute(name,value)  直接设置属性
  3. function appendChild() 拼接子节点
  4. function insertBefore()插入子节点
  • 删 
  1. function removeChild()  删除子节点
  2. function removeAtrributeNode()  删除属性节点 
  • 改 
  1. fn repalce()Child(new,old)  替换子节点
  2. fn setAtrribute() 修改属性 
  • 查 
  1. fn queryElementSelector()  获取css元素
  2. fn ueryElementSlecrotAll()  获取多组元素，返回数组
  3. pro nextElementSibling 获取下一个兄弟标签
  4. pro previousElementSbling  获取上一个兄弟标签
  5. pro firstElementChild 获取第一个标签
  6. pro lastElementChild  获取最后一个标签
  7. pro children 获取子节点
  8. pro parentNode 获取父级节点
Gnaf12345
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JS处理多层嵌套数据
天下大师傅
10-15 2321
数据有两层时我们用for嵌套for来实现，那当层级是未知数量时，我们怎么实现了？来，跟着我一起用递归来一步一步实现这个需求。
js 动态添加元素（div、li、img等）及设置属性
weixin_34049948的博客
02-02 724
把一串 html 标签赋给一个 javascript 变量，除属性的值要用转义的双引号外，某些时候字符串还很长，显得有些复杂。如果用 js 动态添加元素，就不会有那么复杂的字符串出现，代码阅读性强一点，也容易理解。 　　网页是由 html 标签一层层组成的，js 也可以动态添加一层层的诸如 div、li、img 这样的标签。其实，不管是什么 html 标签，js 动态创建的方法都差不多，接着就先...
JS 修改div标签中嵌套的多个p标签中的文字内容
夏沐的博客
01-12 8138
使用函数说明： document.getElementsByTagName("标签的名字");返回的是一个伪数组, 无论获取的是一个标签,还是多个标签,最终都是在数组中存储的,这行代码的返回值就是一个数组 修改div标签中嵌套的p标签的文字内容： HTML代码部分： <input type="button" value="显示效果" id="btn"/> <div ...
JavaScript--嵌套循环中的标签
Manarola的博客
06-29 1366
标签（label）JavaScript语言允许，语句的前面有标签（label），相当于定位符，用于跳转到程序的任意位置，标签的格式如下。label: statement 标签可以是任意的标识符，但是不能是保留字，语句部分可以是任意语句。标签通常与break语句和continue语句配合使用，跳出特定的循环。top: for (var i = 0; i < 3; i++){ for
js-创建追加新节点来添加表格
weixin_45630548的博客
08-27 707
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.
JavaScript DOM 学习总结(五)
10-23
当页面加载时，浏览器会创建页面的文档对象模型（Document Object Model）。文档对象模型定义访问和处理HTML文档的标准方法，本篇文章给大家介绍javascript dom 学习总结(五)，感兴趣的朋友一起学习吧
js学习总结之dom2级事件基础知识详解
01-19
我们使用的DOM2事件绑定，其实是让box通过原型链一直找到EventTarget这个内置类原型上的addEventListener方法实现的。 DOM0级事件绑定:只能给一个元素的某一个行为绑定一次方法，第二次绑定的会把前面的覆盖掉。 DOM...
DOM知识结构Xmind思维导图
05-31
DOM知识结构 Xmind思维导图 帮助各位更好的学习DOM知识点。
前端学习之JavaScript DOM以及DOM操作的基础知识
01-08
javascript真正大放光彩的地方来了——这就是javascript DOM Javascript DOM DOM(Document Object Model)，文档对象模型。 是W3C组织推荐的处理可扩展标记语言（HTML或者XML）的标准编程接口；W3C已经定义了一系列...
[js]DOM操作
分享互联网的有趣知识~
04-18 1363
DOM也就是文档对象模型：document object model 主要用来动态操作HTML的圆度节点，dom操作文档是居于DOM树来为根据草操作的。DOM树为html整体结构框架，其中有各种嵌套标签，最典型的就是以body为主容器，在body内部设置各种元素标签，body在这个时候就是dom里面的主根，其内部的标签为分支。如下图所示： DOM的节点操作样式大致分为：增、删、改、查 操作DOM的元素时需要获取到元素的节点，类似于css的选择器，通过选择器获取到对应的标签节点。以下是获取元素.
JS DOM父节点子节点（浏览器兼容）
牟童的博客
09-13 7394
DOM概述 HTML加载完毕，渲染引擎会在内存中把HTML文档，生成一个DOM树，getElementById是获取内中DOM上的元素节点。然后操作的时候修改的是该元素的属性。 DOM   (文档对象模型) document是文档对象模型的一部分。 DOM是一个复合的数据类型。 DOM的数据结构（树状） HTML的组成部分为节点（ Node ） 在HTML中一切都是节点……...
js css3写嵌套立方体动画效果（大立方内套小立方）
zhangli2513的博客
08-16 1126
先上图： HTML：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"></div> <script
JS递归实现DOM树状结构
Wq_2977的博客
10-15 1333
数据结构 <!-- 后台返回还有其它的内容，但是这里对于生成DOM结构没用上，而且过多，就没写 --> let data = { private:[ { childCategories:[ { childCategories: [ { childCategories: []
js添加多个子节点_JS创建DOM节点－使用document.createElement()创建子节点或同级节点...
weixin_39520210的博客
12-19 3148
在一个Web页面中，需要弹出一个提示信息显示给用户。基于这个需求，要使用document.createElement()创建一个DOM节点。创建完节点后，还要使用appendChild()或insertBefore()将创建的节点插入到DOM的指定位置。1. createElement(name)创建元素节点createElement()是Document对象中的方法，该方法会根据指定的元素名称n...
js之DOM操作（创建元素节点createElement）
web前端菜鸟工程师
09-21 6024
创建元素节点createElement createElement()方法可创建元素节点。此方法可返回一个 Element 对象。 语法： document.createElement(tagName) 参数: tagName：字符串值，这个字符串用来指明创建元素的类型。 注意：要与appendChild() 或 insertBefore()方法联合使用，将元素显示在页面中。
js的DOM节点操作：创建 ，插入，删除，复制，查找节点
Torrex的博客
01-12 2万+
DOM含义：DOM是文档对象模型(Document Object Model，是基于浏览器编程的一套API接口，是W3C出台的推荐标准。其赋予了JS操作节点的能力。当网页被加载时，浏览器就会创建页面的文档对象模型。 节点：根据 W3C 的 HTML DOM 标准，HTML 文档中的所有内容都是节点： 1、整个文档时一个文档节点。 2、每个HTML元素是元素节点。 3、HTML元素内的文本是
js04DOM操作和数组详解
会飞的小鹿
07-06 780
前言 看着这个浮夸的标题是不是觉得不靠谱，因为我是在想不出什么非常好的题目！这一节的内容我将记录自己对于jsDOM操作的一些心得，一些数组方面的操作！ 常见的DOM操作 Node类型 在DOM1级里定义了一组节点类型，每个节点都有一个nodeType属性，用于表明节点在DOM中扮演的角色，同时每一个类型对应着一个值，文档中的每一个节点一定属于其一： NodeTyp...
在js中使用createElement创建HTML对象和元素
热门推荐
hgc0221的博客
10-20 3万+
在js中使用createElement创建HTML对象和元素
javascriptdom学习
最新发布
07-20
对于学习 JavaScript DOM（文档对象模型），你可以按照以下步骤进行： 1. 先了解什么是DOM：DOM 是一种对 HTML 和 XML 文档的编程接口，它将文档解析成由节点和对象（如元素、属性和文本）组成的结构，开发者可以...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值