一个html标签到底包含了多少信息(1)
先来看一段代码:
var dom = document.querySelector('body');
for(var i in dom){
console.log(i,dom[i])
}
可以看到很多,来整理一下,总共有三大类(我自己分的,没有科学依据)
除了一些私有属性、方法(比如a的私有属性href等)和一些空的属性
attributes
events
methods
attributes
根据value类型又分为了几个小分类:
1.普通属性
text
link
vLink
aLink
title
lang
translate true
dir
hidden false
tabIndex -1
accessKey
draggable false
spellcheck true
contentEditable inherit
isContentEditable false
innerText
images
Features
outerText
webkitdropzone
namespaceURI http://www.w3.org/1999/xhtml
prefix null
innerHTML
outerHTML
shadowRoot null
baseURI
isConnected true
baseURI http://192.168.1.86/bootstrap/index.html?#1
isConnected true
nodeValue null
textContent
2.样式属性
bgColor
background
offsetTop 0
offsetLeft 0
offsetWidth 1333
offsetHeight 50
scrollTop 0
scrollLeft 0
scrollWidth 1333
scrollHeight 950
clientTop 0
clientLeft 0
clientWidth 1333
clientHeight 50
3.dom操作属性
offsetParent null
localName body
tagName BODY
previousElementSibling
nextElementSibling
children
firstElementChild
lastElementChild
childElementCount
nodeType 1
nodeName BODY
ownerDocument #document
parentNode
parentElement
childNodes
firstChild
lastChild
previousSibling
nextSibling null
4.其他对象属性
style CSSStyleDeclaration {}
dataset DOMStringMap {}
attributes NamedNodeMap {length: 0}
5.我不知道的类型
ELEMENT_NODE 1
ATTRIBUTE_NODE 2
TEXT_NODE 3
CDATA_SECTION_NODE 4
ENTITY_REFERENCE_NODE 5
ENTITY_NODE 6
PROCESSING_INSTRUCTION_NODE 7
COMMENT_NODE 8
DOCUMENT_NODE 9
DOCUMENT_TYPE_NODE 10
DOCUMENT_FRAGMENT_NODE 11
NOTATION_NODE 12
DOCUMENT_POSITION_DISCONNECTED 1
DOCUMENT_POSITION_PRECEDING 2
DOCUMENT_POSITION_FOLLOWING 4
DOCUMENT_POSITION_CONTAINS 8
DOCUMENT_POSITION_CONTAINED_BY 16
DOCUMENT_POSITION_IMPLEMENTATION_SPECIFIC 32
events
onbeforecopy null
onbeforecut null
onbeforepaste null
oncopy null
oncut null
onpaste null
onsearch null
onselectstart null
onwheel null
onwebkitfullscreenchange null
onwebkitfullscreenerror null
onblur null
onerror null
onfocus null
onload null
onresize null
onscroll null
onbeforeunload null
onhashchange null
onlanguagechange null
onmessage null
onoffline null
ononline null
onpagehide null
onpageshow null
onpopstate null
onstorage null
onunload null
onorientationchange null
onrejectionhandled null
onunhandledrejection null
onabort null
oncancel null
oncanplay null
oncanplaythrough null
onchange null
onclick null
onclose null
oncontextmenu null
oncuechange null
ondblclick null
ondrag null
ondragend null
ondragenter null
ondragleave null
ondragover null
ondragstart null
ondrop null
ondurationchange null
onemptied null
onended null
oninput null
oninvalid null
onkeydown null
onkeypress null
onkeyup null
onloadeddata null
onloadedmetadata null
onloadstart null
onmousedown null
onmouseenter null
onmouseleave null
onmousemove null
onmouseout null
onmouseover null
onmouseup null
onmousewheel null
onpause null
onplay null
onplaying null
onprogress null
onratechange null
onreset null
onseeked null
onseeking null
onselect null
onshow null
onstalled null
onsubmit null
onsuspend null
ontimeupdate null
ontoggle null
onvolumechange null
onwaiting null
ontouchcancel null
ontouchend null
ontouchmove null
ontouchstart null
methods
click click() { [native code] }
focus focus() { [native code] }
blur blur() { [native code] }
hasAttributes hasAttributes() { [native code] }
getAttribute getAttribute() { [native code] }
getAttributeNS getAttributeNS() { [native code] }
setAttribute setAttribute() { [native code] }
setAttributeNS setAttributeNS() { [native code] }
removeAttribute removeAttribute() { [native code] }
removeAttributeNS removeAttributeNS() { [native code] }
hasAttribute hasAttribute() { [native code] }
hasAttributeNS hasAttributeNS() { [native code] }
getAttributeNode getAttributeNode() { [native code] }
getAttributeNodeNS getAttributeNodeNS() { [native code] }
setAttributeNode setAttributeNode() { [native code] }
setAttributeNodeNS setAttributeNodeNS() { [native code] }
removeAttributeNode removeAttributeNode() { [native code] }
closest closest() { [native code] }
matches matches() { [native code] }
webkitMatchesSelector webkitMatchesSelector() { [native code] }
getElementsByTagName getElementsByTagName() { [native code] }
getElementsByTagNameNS getElementsByTagNameNS() { [native code] }
getElementsByClassName getElementsByClassName() { [native code] }
insertAdjacentElement insertAdjacentElement() { [native code] }
insertAdjacentText insertAdjacentText() { [native code] }
insertAdjacentHTML insertAdjacentHTML() { [native code] }
createShadowRoot createShadowRoot() { [native code] }
getDestinationInsertionPoints getDestinationInsertionPoints() { [native code] }
requestPointerLock requestPointerLock() { [native code] }
getClientRects getClientRects() { [native code] }
getBoundingClientRect getBoundingClientRect() { [native code] }
scrollIntoView scrollIntoView() { [native code] }
scrollIntoViewIfNeeded scrollIntoViewIfNeeded() { [native code] }
animate animate() { [native code] }
remove remove() { [native code] }
webkitRequestFullScreen webkitRequestFullScreen() { [native code] }
webkitRequestFullscreen webkitRequestFullscreen() { [native code] }
querySelector querySelector() { [native code] }
querySelectorAll querySelectorAll() { [native code] }
hasChildNodes hasChildNodes() { [native code] }
normalize normalize() { [native code] }
cloneNode cloneNode() { [native code] }
isEqualNode isEqualNode() { [native code] }
isSameNode isSameNode() { [native code] }
compareDocumentPosition compareDocumentPosition() { [native code] }
contains contains() { [native code] }
lookupPrefix lookupPrefix() { [native code] }
lookupNamespaceURI lookupNamespaceURI() { [native code] }
isDefaultNamespace isDefaultNamespace() { [native code] }
insertBefore insertBefore() { [native code] }
appendChild appendChild() { [native code] }
replaceChild replaceChild() { [native code] }
removeChild removeChild() { [native code] }
addEventListener addEventListener() { [native code] }
removeEventListener removeEventListener() { [native code] }
dispatchEvent dispatchEvent() { [native code] }
下一节详细分析
一个html标签到底包含了多少信息(1)的更多相关文章
- C#实现如何判断一个数组中是否有重复的元素 返回一个数组升序排列后的位置信息--C#程序举例 求生欲很强的数据库 别跟我谈EF抵抗并发,敢问你到底会不会用EntityFramework
C#实现如何判断一个数组中是否有重复的元素 如何判断一个数组中是否有重复的元素 实现判断数组中是否包含有重复的元素方法 这里用C#代码给出实例 方法一:可以新建一个hashtable利用hasht ...
- 使用jQuery匹配文档中所有的li元素,返回一个jQuery对象,然后通过数组下标的方式读取jQuery集合中第1个DOM元素,此时返回的是DOM对象,然后调用DOM属性innerHTML,读取该元素 包含的文本信息
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery判断一个标签是否包含另外一个标签
jquery判断一个标签是否包含另外一个标签 一.总结 一句话总结: jquery的find方法配合length属性:if($("#video_md_9_1").find(&quo ...
- 一个 Java 对象到底有多大?
阅读本文大概需要 2.8 分钟. 出处:http://u6.gg/swLPg 编写 Java 代码的时候,大多数情况下,我们很少关注一个 Java 对象究竟有多大(占据多少内存),更多的是关注业务与逻 ...
- 转载:Python Web开发最难懂的WSGI协议,到底包含哪些内容?
原文:PSC推出的第二篇文章-<Python Web开发最难懂的WSGI协议,到底包含哪些内容?>-2017.9.27 我想大部分Python开发者最先接触到的方向是WEB方向(因为总是有 ...
- H5页面实现一个Audio标签加载多个音频文件,并进行播放和展示音频长度
最近微信项目中有需求,要将微信端发送过来的amr格式的语音文件,在项目中的页面上进行展示和播放,实现方式如下: 1.首先java后台收到微信端的消息推送的时候,使用 ffmpeg将amr格式的音频文件 ...
- bootstrap模态框内容替换时会重新触发模态框?<a>标签到底有哪些特殊的特性呢?
segmentfault提问 这个问题我将bootstrap导航栏的<a>去除就解决了,那么问题来了,<a>标签到底有哪些特殊的特性呢? 主要属性href 链接href 这是一 ...
- Effective Java 第三版——75. 在详细信息中包含失败捕获信息
Tips 书中的源代码地址:https://github.com/jbloch/effective-java-3e-source-code 注意,书中的有些代码里方法是基于Java 9 API中的,所 ...
- Windows启动配置数据(BCD)存储文件包含一些无效信息
Windows启动配置数据(BCD)存储文件包含一些无效信息-照牛排 http://www.zhaoniupai.com/archives/223.html 1)近来封装Windows 7,遇到挫折. ...
随机推荐
- java 读取xlsx文件
public class ReadExcel { public static void main(String[] args) { Workbook wb = null; Sheet sheet = ...
- Pycharm:使用Edit Custom VM Options导致Pycharm无法启动
解决办法: Edit Custom VM Options用来扩大内存,但是内存设置不当可能会导致Pycharm无法启动 如果无法启动,可以在我的文档中的pycharm201X.X(日期不同名字也不同) ...
- broken pipe 报错分析和解决办法
参考资料: 1.博客1:https://blog.csdn.net/qq_37535749/article/details/113781338 2.博客2:https://blog.csdn.net/ ...
- SpringSecurity原理解析以及CSRF跨站请求伪造攻击
SpringSecurity SpringSecurity是一个基于Spring开发的非常强大的权限验证框架,其核心功能包括: 认证 (用户登录) 授权 (此用户能够做哪些事情) 攻击防护 (防止伪造 ...
- B站(bilibili) 等级升级脚本-云函数版
前言 云函数运行会莫名其妙的报错(我也不知道为什么,我这边测试有时候报错,有时候不会),并非代码有错,建议在本地运行. 由于之前写的代码有些bug,后面又又又又又又又更新了. 最后更新于2022-1- ...
- laravel 框架登录 参考
一.登录功能1.书写登录路由Route::view('login','login');2.书写登录页面 视图层<form action="{{route('loginDo')}}&q ...
- Python的编译安装
到 Python 官网下载 Python3 curl -O https://www.python.org/ftp/python/3.7.4/Python-3.7.4.tgz 安装依赖 sudo apt ...
- python 关于heapq模块的随笔
heapq模块提供了很多高级功能可以通过help(heapq)查看详细文档: 要点: 1优先级队列让我们可以按照重要程度来处理元素,而不是先进先出 2使用heapq可以应对长列表,因为heap不是复杂 ...
- [WPF] 如何实现文字描边
1. 前言 WPF 的 TextBlock 提供了大部分常用的文字修饰方法,在日常使用中基本够用.如果需要更丰富的表现方式,WPF 也提供了其它用起来复杂一些的工具去实现这些需求.例如这篇文章介绍的文 ...
- atoi atof atol
在c语言中提供了把字符串转化为整数的函数,并没有提供把整数转化为字符串的函数 atoi是标准的库函数 itoa不是标准的库函数(在vs可编译,其它系统中未知) atol把一个字符串转化为long类型 ...