当前位置: 首页 > news >正文

ihtml2document能不能根据id获取dom_javascript的DOM对象

ed745ffd96a688fad473feade3a8af9f.png

DOM

HTML 文档对象模型(HTML Document Object Model)定义了所有 HTML 元素的对象和属性,以及访问和处理它们的方法

HTML DOM 就是关于如何获取、修改、添加或删除 HTML 元素的标准

DOM节点

根据 DOM,HTML 文档中的每个成分都是一个节点

每个 HTML 标签是一个元素节点

每一个 HTML 属性是一个属性节点

包含在 HTML 元素中的文本是文本节点

注释属于注释节点

整个文档是一个文档节点

百度节点对象.nodeType节点对象.nodeName

DOM节点树

HTML 文档中的所有节点组成了一个文档树(或节点树)。HTML 文档中的每个元素、属性、文本等都代表着树中的一个节点。树起始于文档节点,并由此继续伸出枝条,直到处于这棵树最低级别的所有文本节点为止

85bc0c4718eeedfa4959a7f738db09b4.png

节点树

获取元素节点对象

document.getElementById("ID")//根据id 获取节点document.getElementsByTagName("标签名称")//根据标签 获取节点document.getElementsByClassName("类名");//根据类获取节点document.getElementsByName("name属性值")//根据属性 获取节点document.getElementById('ID').getElementsByTagName("标签名称");//根据标签获取节点
e2b1f8ea79d86c9e34c8ee0b78d8837f.png

获取所有节点

获取常用元素对象和对象集合

常用元素节点对象

document.documentElementdocument.headdocument.titledocument.body

常用元素节点对象集合

document.all document.formsdocument.imagesdocument.links document.anchors有name属性的a链接的集合

获取父、子和同胞节点对象

节点对象.parentNode节点对象.childNodes节点对象.firstChild节点对象.lastChild节点对象.previousSibling节点对象.nextSibling节点对象.elements
ddd3b51682af87e2cda426e86e8526a8.png

获取父、子和同胞节点对象

for(var i=0;i

获取元素节点对象标签名

元素对象.tagName

元素对象.nodeName

示例:document.getElementById("demo").tagName

获取及设置元素节点对象属性

获取元素对象属性:

方法1:元素对象.属性名

方法2:元素对象.getAttribute('属性名')

设置元素对象属性:

方法1:元素对象.属性名='属性值'

方法2:元素对象.setAttribute('属性名','属性值')

7433a6a5f4978796dfc66dd131c75792.png

属性设置和获取

获取及设置元素节点对象内容

元素对象.innerHTML

元素对象.outerHTML

元素对象.textContent

表单元素对象.value

67832d0081a28e61cd48e836fb2231e4.png

内容获取和设置

获取及设置元素节点对象样式

元素对象.className="类名"

因为属性名class在JS中为关键字,所在此处写做className

元素对象.style.css属性名="属性值"

如果css属性名带有短横线 "-" ,则须做以下处理

如:background-color要写成backgroundColor

f3cea546e9aadec124cfba20d01803e4.png

样式的设置和修改

创建元素节点对象

document.createElement("标签名称")

节点对象.appendChild("子节点名")

节点对象.insertBefore("新节点名

相关文章:

  • 《高级分形艺术——核心算法、软件实现及创作技巧》
  • c语言fread函数的用法_Sparklyr 1.2支持foreach函数了
  • 一段对话,解决一个Exchange问题
  • ucosiii源码分析笔记 pdf下载_方舟编译器学习笔记14 DriverRunner源码分析
  • wxWidgets在windows VC++下的安装
  • python serial_浅谈python中的多线程和多进程
  • StatCVS 对使用CVS的项目进行深入统计的开源工具
  • 2020无人用的邮箱和密码大全_2020年之微波炉怎么用 微波炉使用注意事项大全
  • 用C原生API写Symbian日志文件
  • go make function_Go中复制文件的3种技巧
  • 猪猪宝贝
  • 简述python文件操作_Python文件操作的几个要点与示例
  • 读书小结
  • tomcat线程被打满怎么排查_Tomcat面试题(2020最新版)
  • oc引导开机直接进_超级详细的oc引导制作过程(二)——config.plist的制作,从入门到入土...
  • [分享]iOS开发-关于在xcode中引用文件夹右边出现问号的解决办法
  • canvas 五子棋游戏
  • CSS实用技巧
  • es6--symbol
  • Java面向对象及其三大特征
  • js算法-归并排序(merge_sort)
  • laravel 用artisan创建自己的模板
  • Markdown 语法简单说明
  • MySQL主从复制读写分离及奇怪的问题
  • Python连接Oracle
  • React-redux的原理以及使用
  • Spring Cloud Alibaba迁移指南(一):一行代码从 Hystrix 迁移到 Sentinel
  • ⭐ Unity 开发bug —— 打包后shader失效或者bug (我这里用Shader做两张图片的合并发现了问题)
  • windows-nginx-https-本地配置
  • windows下mongoDB的环境配置
  • yii2权限控制rbac之rule详细讲解
  • 回顾 Swift 多平台移植进度 #2
  • 推荐一个React的管理后台框架
  • 微信小程序开发问题汇总
  • 新手搭建网站的主要流程
  • 用jQuery怎么做到前后端分离
  • 中国人寿如何基于容器搭建金融PaaS云平台
  • “十年磨一剑”--有赞的HBase平台实践和应用之路 ...
  • Prometheus VS InfluxDB
  • ​MySQL主从复制一致性检测
  • ​Python 3 新特性:类型注解
  • #Java第九次作业--输入输出流和文件操作
  • $.proxy和$.extend
  • $refs 、$nextTic、动态组件、name的使用
  • (2022版)一套教程搞定k8s安装到实战 | RBAC
  • (差分)胡桃爱原石
  • (转)winform之ListView
  • (转)项目管理杂谈-我所期望的新人
  • .java 指数平滑_转载:二次指数平滑法求预测值的Java代码
  • .NET Conf 2023 回顾 – 庆祝社区、创新和 .NET 8 的发布
  • .NET Core WebAPI中使用swagger版本控制,添加注释
  • .NET 设计一套高性能的弱事件机制
  • .Net 知识杂记
  • .NET/C# 的字符串暂存池
  • .net专家(张羿专栏)