获取h5的id属性_js:获取元素的值(id、标签、html5新增、特殊元素的获取)
1、根据id获取
(1)getElementById() 方法
获取元素
console.log(uname);
console.log(typeofuname);
}
getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用。
参数id大小写敏感
返回的是一个元素的对象
(2)console.dir
window.onload =function() {var uname = document.getElementById("myname");
console.log(uname);
console.log(typeofuname);
console.dir(uname);
}
console.dir能够返回详细信息:
attributeStyleMap: StylePropertyMap
size:0__proto__: StylePropertyMap
attributes: NamedNodeMap {0: id, id: id, length: 1}
autocapitalize:""autofocus:falsebaseURI:"http://127.0.0.1:8020/test20200630/test.html?__hbt=1595464777990"childElementCount:0childNodes: NodeList [text]
children: HTMLCollection []
classList: DOMTokenList [value:""]
className:""clientHeight:64clientLeft:0clientTop:0clientWidth:900contentEditable:"inherit"dataset: DOMStringMap {}
dir:""draggable:falseelementTiming:""enterKeyHint:""firstChild: text
firstElementChild:nullhidden:falseid:"myname"innerHTML:"2020-07-22"innerText:"2020-07-22"inputMode:""isConnected:trueisContentEditable:falselang:""lastChild: text
lastElementChild:nulllocalName:"div"namespaceURI:"http://www.w3.org/1999/xhtml"nextElementSibling: iframe#blockbyte-bs-sidebar.notranslate
2、根据标签获取
(1)根据标签获取元素
获取元素
console.log(list);for(var i inlist){
console.log(list[i]);
}
}
返回带有指定标签名的对象集合
(2)返回标签内的元素
获取元素
console.log(testli);
}
- 2020年7月23日09:15:55
- 2020年7月23日09:16:02
- 2020年7月23日09:16:08
3、html5新增的获取方法
(1)根据类名获取
获取元素
console.log(boxs);
}
(2)querySelector
获取元素
console.log(box);
}
只能返回指定选择器的第一个对象,id选择器用#,类加点
(3)querySelectorAll
获取元素
console.log(boxs);
}
只能返回指定选择器的所有对象,id选择器用#,类加点
4、获取特殊元素
(1)获取body元素和html元素
获取元素
console.log(bodyTest);
console.log(htmlTest);
}
获取h5的id属性_js:获取元素的值(id、标签、html5新增、特殊元素的获取)相关推荐
- HTML5新增页面元素与属性
1. 结构元素 (1)<header>元素 HTML5中的header元素是一种具有引导和导航作用的结构元素,该元素可以包含所有通常放在页面头部的内容.其基本语法格式如下: <h ...
- HTML5 新增结构元素分为主体结构元素和非主体结构元素
做移动端有一段时间,今天有同事问了我 article 和 section 标签的使用,模模糊糊的解释了下,他似懂非懂,有点小尴尬.忽然间觉得自己有必要再翻翻书籍,重温下 html5 的新元素.今天先介 ...
- html5新增标记元素的内容类型,HTML5新标签与javaScript新方法
HTML5 (0106) 1.文档声明 2.字符编码设置 3.验证(http://validator.w3.org/) HTML5新增的语义化标签 1.语义化标签:说明页面内容,便于搜索引擎寻找该内容 ...
- HTML5新增内容元素和表单控件
HTML5新增语义化标签 <header>头部</header> <nav>导航</nav> <main>主体</main> & ...
- html5的交互标签,html5里交互元素的使用方法
在H5里,交互元素就是和用户进行互动的元素,这一部分非常的重要,并且和之前的JS控制的效果不同,H5相比于HTML增加了很多的交互元素,比如隐藏显示注脚就是其中的一个交互效果. 交互元素的使用 bod ...
- 如何获取某个标签下所有的元素id_02 HTML标签(下)
1.表格标签 表格是实际开发中非常常用的标签: 表格的主要作用 表格的基本语法 1.1 表格的主要作用 表格的主要作用用于显示.展示数据的.因为它可以让数据显示的非常规整,可读性非常好.特别是后台显示 ...
- jquery获取元素的值,获取当前对象的父对象等等
jsp代码: <span><input type="hidden" value="1" id="newInfo">& ...
- 不要动态修改 DOM 里面的 id 属性
我不知道是否有什么标准规定不允许修改id属性,或者不建议修改id属性,总之IE对此支持不佳.在IE当中,修改id属性对将来的DOM操作没什么不符合标准的影响,你仍然可以通过document.getEl ...
- html中id属性,html中的id属性是什么?id属性的使用
html中的id属性是什么?本篇文章给大家带来的内容是介绍html中的id属性,让大家了解id属性的使用方法,希望对大家有所帮助. html的id属性是什么? html的id属性其实就是一个HTML元 ...
最新文章
- 《leetcode》longest-substring-without-repeating
- jvm7 jvm8_我们真的仍然需要32位JVM吗?
- Opencv级联分类器实现人脸识别
- vsftpd安装配置_CentOS7配置vsftpd虚拟用户模式详解
- 使用move_base做4个点循环跑的导航
- Ajax基础(五)--封装库
- 项目开发流程以及接口文档
- 第九节 html特殊文字符号
- win10分辨率不能调整_三国志:游戏在win10系统无法运行咋办?
- 元宇宙专题003 | 如何才能抢先一步,各个省市元宇宙布局抢先看
- NOI 2017 滚粗记
- 初探摩根大通的企业级以太坊区块链解决方案—Quorum
- Windows中Latex应用排版、常用引用、公式、表格等
- IT 行业:前端和后端分别是要做什么?哪个方向加班时间更多?
- 以下为linux下64位c,64位ntohl()在C?
- 开源ERP系统weberp的安装与配置
- 360安全浏览器android,360安全浏览器手机版
- poi-tl,根据word模板导出word(表格行循环,表格无表头的情况)
- 计算机主板现状,怎么确定电脑主板坏了?计算机主板坏了有什么症状?
- 遥感(3):航空遥感和航测成图
热门文章
- 6. GDAL进行栅格转矢量
- UTC-5 EST 是哪儿的时间
- ROC 曲线讲解 (Receiver Operarating Curve)
- 北京理工大学计算机基本介绍
- 经纬恒润正式升级为AUTOSAR高级合作伙伴
- 逍遥模拟器过检测_BMS选用什么样的电池模拟器
- xposed绕过模拟器检测_利用Xposed躲过Xposed检测
- plupload怎么设置属性_jquery上传插件:plupload事件参数说明详解
- 库存商品出入库方式分析收藏
- GPS数据矢量化JAVA_SVGX矢量化图形编辑器,100%JAVA实现的矢量化图形编辑器