html5 dom 结构,HTML5 DOM扩展
一、选择符
1. querySelector()方法:返回与该模式匹配的第一个元素
//取得body元素
var body = document.querySelector("body");
//获取的ID为"one"的元素
var one = document.querySelector("#one");
//获取的Class为"two"的第一个元素。注意:并不是所有元素
var two = document.querySelector(".two");
2. querySelectorAll()方法 :返回与该模式匹配的所有元素
//获取的所有"li"的元素
var lis=document.querySelectirAll("li");
//获取的ID为="box"下所有"li"的元素
var lis=document.querySelectir("#box").querySelectirAll("li");
//获取的img标签Class为"show"的所有元素
var lis=document.querySelectirAll("img.show");
3. matchesSelector()方法 :调用元素是否与选择符匹配
if(document.body.matchesSelector('body.app'){
//ture
}
二、元素遍历
1.childElementCount:返回子元素的个数(不包括文本节点和注释)
2.firstElementChild:指向第一个子元素
3.lastElementChild:指向最后子元素
4.previousElementSibling:指向前一个同辈元素
5.nextElementSibling:指向下一个同辈元素
6.classList属性:可以对类名进行添加、删除、替换等操作
//删除"hide"类
div.classList.remove("hide");
//添加"show"类
div.classList.add("show");
//切换"high"类
div.classList.toggle("high");
更多属性请自行查看相关资料...
html5——DOM扩展
元素获取 1.document.getElementsByClassName ('class') 通过类名获取元素,以类数组形式存在. 2.document.querySelector(‘div’) ...
DOM扩展札记
Selector API HTML5 DOM扩展 Element Traversal规范 Selector API 众多JavaScript库中,最常用的一个功能就是根据css选择符选择与某个模式匹配 ...
HTML5部分新标签属性及DOM扩展元素
HTML5定义了一系列新元素,如新语义标签.智能表单.多媒体标签等. 我们日常讨论的H5其实是一个泛称,它指的是由HTML5 + CSS3 + Javascript等技术组合而成的一个应用开发平台. ...
HTML5学习笔记(二十四):DOM扩展
DOM扩展 DOM标准扩展最开始都是来自各个浏览器的自定义扩展DOM的功能,后被收录为标准的DOM相关API. 本笔记只记录被各大浏览器支持的标准扩展,对于特定浏览器的专有扩展不讨论. 选择符API ...
DOM扩展-Selectors API(选择符 API)、元素遍历
DOM扩展 对DOM的两个主要扩展是SelectorsAPI(选择符API)和HTML5 SelectorsAPI(选择符API)是由W3C发起制定的一个标准,致力于浏览器原生支持CSS查询,Sele ...
dom扩展
第十一章 DOM扩展 一.选择符API 1.querySelector()方法 接收一个CSS选择符,返回与该模式匹配的第一个元素,如果没有找到匹配的元素,返回null. 2. ...
11. javacript高级程序设计-DOM扩展
1. DOM扩展 1.1 选择符API l querySelector() 接收一个css选择符,返回与该模式匹配的第一个元素 l querySelectorAll() 接收一个css选择符,返回所有 ...
js-DOM,DOM扩展
DOM: 1. 了解节点的信息:nodeName(属性的标签名),nodeValue两个属性 在取得信息之前要进行判断是不是节点,节点类型由12个数值常量进行表示 2.每个节点都有一个childNod ...
《JAVASCRIPT高级程序设计》DOM扩展
虽然DOM为XML及HTML文档交互制定了一系列的API,但仍然有几个规范对标准的DOM进行了扩展.这些扩展中,有很多是浏览器专有的,但后来成了事实标准,于是其他浏览器也提供了相同的实现:浏览器开发商 ...
随机推荐
Javascript高性能编程-提高javascript加载速度
1.将所有
idlcpp 功能改进
最近没有续写 idlcpp 的教程, 因为忙着对它进行大幅度的修改. 一开始本是计划用idlcpp对付新写的代码,让这些新写的代码能够很容易提供给脚本使用.后来又希望能将大量现存的代码移植过来,毕竟有 ...
BZOJ 1001 题解
1001: [BeiJing2006]狼抓兔子 Time Limit: 15 Sec Memory Limit: 162 MBSubmit: 18876 Solved: 4649[Submit][ ...
sublime3笔记
选择类Ctrl+D 选中光标所占的文本,继续操作则会选中下一个相同的文本. Alt+F3 选中文本按下快捷键,即可一次性选择全部的相同文本进行同时编辑.举个栗子:快速选中并更改所有相同的变量名.函数名 ...
【LEETCODE OJ】Clone Graph
Problem link: http://oj.leetcode.com/problems/clone-graph/ This problem is very similar to "Cop ...
C# 解决DrawImage绘制图片拉伸产生渐变
ImageAttributes ImgAtt = new ImageAttributes(); ; ImgAtt.SetWrapMode(System.Drawing. ...
第十二章作业 MemoryBugs-master项目优化笔记
作业要求: 下载bug项目:https://github.com/lzyzsd/MemoryBugs,请注意配合使用MemoryMonitor, AllocationTracker以及HeapDump ...
linux在下面APK反编译软件和过程的描述
需要的工具: 1.apktool apk打包工具 下载地址:http://android-apktool.googlecode.com/files/apktool1.5.2.tar.bz2 安装:直接 ...
cronolog 对 tomcat 7 进行日志切割
一.安装 软件 cronolog-1.6.2.tar.gz tar zxvf cronolog-1.6.2.tar.gz cd cronolog-1.6.2 ./configure && ...
html5 dom 结构,HTML5 DOM扩展相关推荐
- DOM结构(DOM树)
DOM 文档类型DOM(Document Object Model)主要用于HTML文档和XML文档的内容进行操作.DOM描绘了一个层次化的节点树,通过节点的操作,来实现对文档内容进行增删改查. 1. ...
- jre是否支持html5,html5的结构
目录 一.新增的主体结构元素 1.1.article元素 1.2.section元素 1.3.nav元素 1.4.aside元素 1.5.time元素 1.6.pubdate元素 二.新增的非主体结构 ...
- HTML5游戏_基于DOM平台跳跃小游戏开发_9.按键监听
HTML5游戏_基于DOM平台跳跃小游戏开发 按键监听 视频讲解 HTML5游戏 效果图 本章知识点: 对象自定义名称属性,可以用变量来命名属性名称 //这段代码把多个属性(品牌, 型号, 排量)赋给 ...
- HTML5交互性是什么意思,HTML5的结构和语义(5):交互
HTML5的结构和语义(5):交互 互联网 发布时间:2008-10-17 18:55:30 作者:佚名 我要评论 http://www.webjx.com/html_xhtml/2008 ...
- 简单认识JavaScript 与 DOM结构的文本、标签和属性节点
一 JavaScript JavaScript 是属于网络的脚本语言!被数百万计的网页用来改进设计.验证表单.检测浏览器.创建cookies,以及更多的应用.JavaScript 是因特网上最流行的脚 ...
- html5语义元素表,HTML5的结构和语义(3):语义性的块级元素
HTML5的结构和语义(3):语义性的块级元素 互联网 发布时间:2008-10-17 18:55:35 作者:佚名 我要评论 HTML5还增加了一些纯语义性的块级元素: aside fi ...
- javascript遍历DOM结构和对象结构
在实际工作中,记住浏览器中对象的属性.方法几乎是件不可能完成的任务,保持一份资料或网址是个好办法.但是查阅资料也是要花费不少时间,如果能有个脚本将对象的结构打印出来,将会加速开发进程. 下面是我编写的 ...
- HTML5 新增结构元素分为主体结构元素和非主体结构元素
做移动端有一段时间,今天有同事问了我 article 和 section 标签的使用,模模糊糊的解释了下,他似懂非懂,有点小尴尬.忽然间觉得自己有必要再翻翻书籍,重温下 html5 的新元素.今天先介 ...
- jQuery EasyUI Datagrid组件的完整的基础DOM结构
标题可能有点长,什么叫"完整的基础DOM结构",这里"基础"的意思是指这个结构不依赖具体数据,不依赖Datagrid的view属性,只要存在Datagrid实例 ...
- (三)html5的结构
一.新增的主题结构元素 在html5中,为了使文档的结构更加清晰明确,追加了几个页眉.页脚.内容区块等文档结构相关的结构元素, 1.article元素 article元素代表文档.页面或者应用程序中独 ...
最新文章
- BUILD 2015: Visual Studio对GitHub的支持
- 过滤特征_LR训练优化-稀疏特征过滤
- mysql 升级 openssl_【1分钟教程】LNMP架构应用实战 Openssl升级操作
- 【Https】keytool 导入证书到 本地 Exception: Input not an X.509 certificate
- 【Opencv系列】之显示图像以及使用鼠标截取图像局部区域进行放大
- 顺序表应用2:多余元素删除之建表算法(SDUT 3325)
- BNUOJ 34978 汉诺塔 (概率dp)
- Pycharm安装jieba库
- 环球企业家:web2.0创业时代将终结
- Python 生成、识别社会统一信用代码
- 【华为机试真题 Python实现】一个正整数到 Excel 编号之间的转换
- 高考失利后选择出国留学,一年至少20万人民币到底值不值?
- 新冠疫情历史数据(COVID-19-Data)
- 图像处理中的二值化和灰度化
- python xlwt 用法演示
- STM32红外寻迹小车
- L. Spicy Restaurant(多源BFS+递推)
- linux下ib下抓包,HP-UX下的抓包工具nettl
- 致远SPM解决方案之公务车辆管理
- android 开发游戏_Android游戏开发–基本游戏循环