dom 文本对象模型

12种节点类型

一、node类型  js中所有节点类型都继承自node类型 每个节点都有一个nodeType属性，表明节点类型；判断节点类型，if（somenode.nodeType==Node.ELEMENT_NODE）

1要了解节点特性需要nodeName 和nodeValue ，在使用前需要验证节点的类型 somenode.name的值是元素标签名，somenode.value始终为null。测试如下：

<body>
    <div id ="node"></div>
</body>
</html>
<script>
   if (document.getElementById("node").nodeType ==1) {
   alert( document.getElementById("node").nodeName) //DIV
   alert( document.getElementById("node").nodeValue) //null
       
   }
</script>

2节点关系childNodes parentNodes

nextSibling previousSibling   firstchild lastchild

<body>
    <div id ="node">
        <div></div>
    </div>
</body>
</html>
<script>
    var somenode = document.getElementById("node")
   if (somenode.nodeType ==1) {
   alert(somenode.nodeName) //DIV
   alert(somenode.nodeValue) //null
   alert(somenode.childNodes[1]) // htmlelementdiv
       
   }
</script>
3.操作节点
appendchild(）
insertBefore（要插入的节点，作为参照的节点（null 最好一个）（somenode.firstchild 第一个））
replaceChild  cloneNode（blooem）

二、document类型

nodeType=9  nodename#document

1.文档的子节点可以是 documentType Element comment

2.文档信息 document.title URL   domain //  referrer

3.查找元素 getElementById（）   getElementsByTagName（）返回nodelist getElementByName

4.文档写入 write（ ） writeln（） open（） close（）

Dom 的理解和操作的更多相关文章

  1. DOM的理解

    https://www.cnblogs.com/djtang/p/11538420.html  dom的理解 https://blog.csdn.net/jiuqiyuliang/article/de ...

  2. 使用Dom解析器，操作XML里面的信息

    import java.io.FileNotFoundException;import java.io.FileOutputStream;import java.io.IOException;impo ...

  3. HTML DOM元素关系与操作

    <html> <head><title>DOM元素关系与操作</title></head> <body> <!-- div ...

  4. Dom,查找标签和操作标签

    Dom,查找标签和操作标签 文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它给文档提供了一种结构化的表示方法,可以改变文档的内容和呈现方式 ...

  5. DOM的查找与操作

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  6. accp8.0转换教材第7章JavaScript操作DOM对象理解与练习

    程序调试,chrome开发人员工具,DOM操作,节点和节点间的关系,节点信息,操作节点,获取元素 一.单词部分 ①alert警告②prompt提示③parentNode父节点④childNode子节点 ...

  7. javaScript操作DOM深入理解

    做为一个web前端,处理和了解浏览器差异一个重要问题.下面将介绍本人在工作中的一些笔记总结,先介绍没有使用js库的情况. 1. setAttribute方法设置元素类名 : 在jQuery中,直接使用 ...

  8. 对dom的理解

    js对dom的操作可以理解为: 增.删.改.查 获取对象:查 对象操作:增,修,删 内容操作:innerHTML,innerText等 事件操作:mouse,key 样式操作:id,tag,class ...

  9. JavaScipt中对DOM的理解

    一.理解DOM 浏览器通过文档对象模型DOM使JavaScript程序可以访问页面上的元素,而DOM是页面上XHTML中文档正文标题.段落.列表.样式ID.class以及所有其他出现的数据的一个内部表 ...

  10. Virtual DOM 虚拟DOM的理解(转)

    作者:戴嘉华 转载请注明出处并保留原文链接( #13 )和作者信息. 目录: 1 前言 2 对前端应用状态管理思考 3 Virtual DOM 算法 4 算法实现 4.1 步骤一:用JS对象模拟DOM ...

随机推荐

  1. TypeScript：接口

    介绍 TypeScript的核心原则之一是对值所有的结构类型进行类型检查.在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义约束. 接口的基本使用 interface ...

  2. Pytorch 最全入门介绍，Pytorch入门看这一篇就够了

    本文通过详细且实践性的方式介绍了 PyTorch 的使用,包括环境安装.基础知识.张量操作.自动求导机制.神经网络创建.数据处理.模型训练.测试以及模型的保存和加载. 1. Pytorch简介 在这一 ...

  3. RR有幻读问题吗？MVCC能否解决幻读？

    幻读是 MySQL 中一个非常普遍,且面试中经常被问到的问题,如果你还搞不懂什么是幻读?什么是 MVCC?以及 MySQL 中的锁?那么请好好收藏和阅读本篇文章,因为它非常重要. RR 隔离级别 在 ...

  4. dimp V8：[WARNING]login fail, check your username and password, and check the server status

    在进行某个项目的性能测试时,我们选择了达梦8作为使用的数据库.因前期的网络安全问题和考虑到节省成本,我们首先在公司本地服务器上搭建了相应的环境,并生成了用于压力测试的业务数据. 然而,在将数据库迁移到 ...

  5. selenium报错：This version of ChromeDriver only supports Chrome version 109 Current browser version is 112.0.5615.49...解决办法

    前言:跟GPT交互,让其写一段代码,执行失败.经过排查验证,GPT写的代码没有问题,是本地环境问题. 执行报错: selenium.common.exceptions.SessionNotCreate ...

  6. Java代码审计之某博客

    对某博客的代码审计 在gitee上面找了一个个人博客项目,来进行实战代码审计,主要还是学习为主 技术菜菜,哪里错误希望师傅们指正 1.SQL注入 先了解Java Web中的数据传输流程 graph T ...

  7. ImGui界面优化：使用图标字体、隐藏主窗口标题栏

    目录 使用图标字体 扩展:内存加载字体 隐藏主窗口标题栏 增加程序退出 改进HideTabBar 窗口最大化 总结 本文主要介绍ImGui应用中的一些界面优化方法,如果是第一次使用ImGui推荐从上一 ...

  8. LeetCode952三部曲之一：解题思路和初级解法(137ms，超39%)

    欢迎访问我的GitHub 这里分类和汇总了欣宸的全部原创(含配套源码):https://github.com/zq2599/blog_demos 题目描述 难度:困难 编程语言:Java 给定一个由不 ...

  9. crontab定时任务不执行的一些原因总结

    参考博文地址: https://www.jb51.net/article/154290.htm声明:本文章是在以上地址博文基础上进行整理学习,如有侵权,请联系博主删除,感谢知识共享,一起进步,加油鸭 ...

  10. VR国标

    <软件基本要求与测试方法>