html之dom
HTML dom
2023-09-11 14:15:07 时间
dom结构
dom节点类型
<ul> <li>11</li> <li>22</li> </ul> var ul=document.getElementById('ul'); var lis=us.childNodes; console.log(lis.length) 打印的值是5,因为<li>节点前后的空白也算文本节点
childNodes:找到所有节点,包括所有子节点,包括元素子节点,注释节点,文本节点等等
children:不是标准的属性,但是所有浏览器都支持
找到某个元素下所有元素子节点
parentNode:父节点
nextElementSibling:下个兄弟节点
previousElementSibling:上个兄弟节点
firstElementChild:第一个子节点
lastElementChild:最后一个子节点
offsetParent:最近的有定位属性的祖先节点,如果祖先节点都没有定位,默认为body
offsetLeft:左外边框到有定位父级的左内边框的距离
offsetTop:上外边框到有定位父级的上内边框的距离
getBoundingClientRect(返回值为一个对象):获取某个元素的信息(高版本:left,top,bottom,rigit,width,height)
注意:获取的值是会根据滚动条变化的。
elem.getAttribute('key') //获取元素行间的属性
elem.setAttribute('key','value') //设置元素的行间属性
elem.removeAttribute('key') //删除元素的行间属性
相关文章
- HTML入门学习笔记(二)
- 关于Simple_html_dom的小应用
- 上层建筑——DOM元素的特性与属性(dojo/dom-prop)
- HTML的attribute和DOM的property剖析(转)
- [HTML 5] Inserting DOM as String template insertAdjacentHTML
- [HTML 5] Understanding DOM loading event & 'async', 'defer' keyword
- HTML 显示/隐藏DIV的技巧(visibility与display的差别)
- simple_html_dom使用小结
- strings.xml显示html格式
- [HTML 5] Inserting DOM as String template insertAdjacentHTML
- 深入学习SAP UI5框架代码系列之三:HTML原生事件 VS UI5 Semantic事件
- HTML里Dom onload和jQuery document ready这两个事件的区别
- Atitit 常见概念与技术 dom及其解析 目录 1.1. Dom概念(文档对象模型(Document Object Model))是什么1 1.1.1. 节点2 1.1.2. Node 层次
- atitit.js的 字符串内容 转义 js处理html
- paip.uapi 获取网络url内容html 的方法java php ahk c++ python总结.
- SAP UI5 应用 index.html 里各个属性赋值逻辑的讲解
- 使用Angular的property binding给HTML DOM元素的class动态赋值
- 两个html中div的复用 如何在HTML不同的页面中,共用头部与尾部?iframe标签
- 〖大前端 - 基础入门三大核心之 html 篇⑯〗- 认识表格 与 合并单元格
- 什么是html?
- <html>
- python 反扒技巧 爬虫失败的原因分析 html的学习 css java html dom bs4 xpath selenium js混淆加密 反混淆 ajaxs
- Chrome Developer Tools 中的 Preview 不显示 HTML 的问题
- HTML(一)html书写规则、基础元素、功能元素