WEB API —— Element 之 属性

元素——文档中所有对象继承的最基础的基类。他只有所有元素所共有的方法和属性。更具体的类继承自 Element 。

例如:

HTML Element接口是所有 HTML 元素的基本接口,而 SVG Element 接口是所有 SVG 元素的基本接口。

大多数功能是在类的层级下具体指定的。

属性:

1.attribute

Element.attributes 属性返回指定节点的所有属性的实时集合。 它是一个 NamedNodeMap,而不是一个Array,所以它没有Array方法,而且Attr节点的索引在浏览器中可能会有所不同。 更具体地说,属性是表示关于该属性的任何信息的键/值对的字符串。

2.classLists

Element.classList —— 只读属性,返回元素的类的实时 DOMTokenList 集合。

方法:

1)add (String) 给元素添加一个 class,如果给定的这个 class 已添加则忽略;

2)remove(String) 删除元素的一个给定 class,如果元素没有这个 class ,也不报错;

3)item(Number) 返回 classList 指定 index 的值 ,类似于Element.classList[Number];

4)toggle(String) 如果存在这个 class,则将其删除,并返回 false;如果不存在这个 class,则将其添加在元素上,并返回 true;

5)contains(String) classList中存在 String 这个 class,则返回 true,否则返回 false;

6)replace(old Class,newClass) 用 newClass 替换 oldClass。oldClass 不存在则不替换。

3.className

Element.className—— 获取或设置元素的 class ,获取的 class 是字符串。

4.

Element.clientHeight——height + padding

Element.clientWidth——width+ padding

HTMLElement.offsetHeight——height + padding + border-top + border-bottom

HTMLElement.offsetWidth——width+ padding + border-left + border-right

Element.scrollHeight / Element.scrollWidth 包括被掩藏未显示的部分

以上三种都会将值转换为整数,如要获得小数值,可使用 Element.getBoundingClientRect(),这个方法会返回一个包含元素尺寸及其相对于视窗的位置的对象。

5.innerHTML

获取或设置元素的内容

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 157,373评论 4 361
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 66,732评论 1 290
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 107,163评论 0 238
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,700评论 0 202
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,036评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,425评论 1 211
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,737评论 2 310
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,421评论 0 194
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,141评论 1 239
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,398评论 2 243
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 31,908评论 1 257
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,276评论 2 251
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,907评论 3 233
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,018评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,772评论 0 192
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,448评论 2 269
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,325评论 2 261

推荐阅读更多精彩内容

  • 原文 https://www.kancloud.cn/dennis/tgjavascript/241852 一、节...
    LuckyS007阅读 795评论 0 0
  • Element对象对应网页的HTML标签元素。每一个HTML标签元素,在DOM树上都会转化成一个Element节点...
    周花花啊阅读 992评论 0 0
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,087评论 18 139
  • 六祖慧能大师在悟道前,偶尔听到有人念“应无所住而生其心”这句经文,心中豁然开悟,于是问此人念的是什么经?此人说是《...
    善馨阅读 1,985评论 0 1
  • 写在前面: 这不是一篇读后感,只是一本书的干货分享。因为当时明月已经写得很直白了,我只是整理了一下自己的思路作以分...
    小P的P阅读 890评论 1 8