CSS选择器之间的差异

Question

我不知道之前是否曾经问过这个问题，但现在我正在写一些这样的css样式表

[myclass]{
/*some styles*/
}

HTML

<div myclass></div>

但我知道很多人都是这样写的

.myclass{
    /*some styles*/
    }

HTML

<div class="myclass"></div>

有什么区别？也许某些浏览器支持与否？或者他们支持移动设备呢？它是合法的CSS风格脚本吗？

Answer 1

第一个示例中的[myclass]选择器不是用于类，而是用于其他HTML属性。有关详细信息，请参阅Attribute Selectors。

Answer 2

尽管所有浏览器都支持这种基于属性的方法，而且可能没有明显的性能差异，但它的HTML无效（验证失败）。这是我以前没见过的风格，原因是这是一个坏主意。课程已存在多年，并拥有各种支持机制，任何初学HTML程序员都能理解。

例如，＆＃34; normal＆＃34;类使用，您可以使用elt.classList.add或$(elt).addClass，并一次添加多个类，并切换它们，并使用elt.className获取整个列表，并获取{{1}的元素}}。这些机器都不适用于您的＆＃34;类属性＆＃34;动物。您必须使用getElementsbyClassName一次删除一个，然后elt.removeAttribute将其添加回来，使用elt.setAttribute查找它们等等。