HTML标准属性
HTML 标签可拥有属性。
这里列出的属性是通用于每个标签的核心属性和语言属性(有个别例外)。
核心属性 (Core Attributes)
以下标签不提供下面的属性:base、head、html、meta、param、script、style 以及 title 元素。
属性 | 值 | 描述 |
---|---|---|
class | classname | 规定元素的类名(classname) |
id | id | 规定元素的唯一 id |
style | style_definition | 规定元素的行内样式(inline style) |
title | text | 规定元素的额外信息(可在工具提示中显示) |
语言属性 (Language Attributes)
以下标签不提供下面的属性:base、br、frame、frameset、hr、iframe、param 以及 script 元素。
属性 | 值 | 描述 |
---|---|---|
dir | ltr | rtl | 设置元素中内容的文本方向。 |
lang | language_code | 设置元素中内容的语言代码。 |
xml:lang | language_code | 设置 XHTML 文档中元素内容的语言代码。 |
键盘属性 (Keyboard Attributes)
属性 | 值 | 描述 |
---|---|---|
accesskey | character | 设置访问元素的键盘快捷键。 |
tabindex | number | 设置元素的 Tab 键控制次序。 |
HTML自定义属性
HTML自定义属性:HTML规范也允许我们自定义一些属性。(最新规范中,推荐以data-开头)
通过打点设置自定义属性
① 可以设置属性成功,但是没有设置到标签内,不会显示在标签里(想要显示在标签里 请使用setAttribute方法)
② 打点调用可以获取属性值,getAttribute方法不能获取属性值
通过setAttribute方法设置属性
① 可以设置属性成功,并且设置到标签内
② 必须通过getAttribute方法才能获取属性值,打点调用获取不到
HTML 标准属性 和 自定义属性的区别联系
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="box" style="width: 200px;height: 200px;background-color:red;" nameId="123">eqweqwe</div>
<script type="text/javascript">
var box = document.getElementById("box");
// console.log(box.style.width);
// console.log(box.nameId);
// console.log(box.getAttribute("nameId"));
// box.setAttribute("sexId","321");
// console.log(box.getAttribute("sexId"));
// box.ageId="345";
// console.log(box.ageId);
// console.log(box.getAttribute("ageId"));
// box.setAttribute("ageId","456");
// console.log(box.ageId);
// console.log(box.getAttribute("ageId"));
</script>
</body>
</html>
HTML标准属性:HTML规范中给每一个标签都定义了一系列的属性,这些属性可以直接写在html标签身上,起到一定的作用。
HTML自定义属性:HTML规范也允许我们自定义一些属性。(最新规范中,推荐以data-开头)
HTML标签在JS环境下叫对象(元素)
所有的HTML标准属性都会从该元素身上获取到
如果设置元素自定义属性 不会显示在标签里 想要显示在标签里 请使用setAttribute方法
元素.setAttribute(key, value); 这是在设置标签内容
元素.自定义属性是将元素当做JS的对象在处理
所谓的HTML标准属性就是指的HTML规定的一些标签属性。
比如id、style、class都是HTML标准属性中的通用属性
还有一些HTML标准属性不是通用的而是某一些标签特有的
比如: a标签的href属性 img标签的src属性 form表单的action属性 method属性等
HTML标准属性有一个特点就是可以直接在JS中获取元素之后,打点读取、打点设置