CSS/HTML代码attribute 对象 是啥意思，代表啥

Posted 2023-04-30

以对象的形式代表了 html 元素的标签属性或属性。成员表下面的表格列出了 attribute 对象引出的成员。请单击左侧的标签来选择你想要查看的成员类型。 标签属性/属性 SHOW:标签属性/属性集合方法标签属性属性描述 expando设置或获取表明是否可对象内创建任意变量的值。 firstChild获取对象的childNodes 集合的第一个子对象的引用。 lastChild获取该对象 childNodes 集合中最后一个子对象的引用。NAMEname设置或获取对象的名称。 nextSibling获取对此对象的下一个兄弟对象的引用。 nodeName获取特定结点类型的名称。 nodeType获取所需结点的类型。 nodeValue设置或获取结点的值。 ownerDocument设置或获取结点关联的 document 对象。 parentNode获取文档层次中的父对象。 previousSibling获取对此对象的上一个兄弟对象的引用。 specified获取是否指定了该属性。 value设置或获取对象的值。注释attribute 对象可通过 attributes 集合访问。一个合法的标签属性或属性可以是应用于该对象的任何动态 HTML (DHTML)属性或事件，或者是扩展属性。此元素在 Microsoft�0�3 Internet Explorer 5.0 的脚本中可用。示例这个例子使用 attribute 对象来创建已指定的属性清单。 参考技术A attribute 对象应该表示的是dom元素的各个属性的集合。

js中有getAttribute()和setAttribute()两个方法，第一个方法是获取属性，第二个方法是设置属性。

CSS高级篇——属性选择器 (attribute selectors)

属性选择器可以定位到拥有某个属性的元素，甚至可以精确到具体的属性值。

属性匹配

选择器后面跟一个方括号，方括号内是属性名：

abbr[title]  
    border-bottom: 1px dotted #ccc;

上述代码的含义是：为有 title 属性的 abbr 标签添加一条灰色的下划线。

属性值匹配

用法与上面类似，只不过还可以进一步指定属性值：

input[type=text]  
    width: 200px; 

上述代码只会作用于 “type” 属性值为 “text” 的 “input” 标签：<input type="text">。

除此之外，还可以同时指定多个属性：

input[type=text][disabled]  
    border: 1px solid #ccc;
 

属性模糊匹配

CSS3 进一步扩展了属性选择器的用法：

• [attribute^=something] - 匹配以 “something” 开头的属性
• [attribute$=something] - 匹配以 “something” 结尾的属性
• [attribute*=something] - 匹配含有 “something” 属性

举个例子，下面代码可以让外部链接（以 “http” 开头）的样式区别于内部链接：

a[href^=http] 
    padding-right: 10px;
    background: url(arrow.png) right no-repeat;