Question

出于好奇，它会对网站或网页产生什么影响（如果有的话），而不是使用ID或类的元素，你只需创建自定义元素w / JS并用CSS设置它们的样式？

例如，如果我创建一个元素“container”并将其用作<container＆gt;而不是<div class="container">，是否存在性能差异？

我不认为这经常使用，我想知道为什么？

Answer 1

HTML是标准化的，你不能简单地发明新的元素。有些浏览器会渲染一个他们无法识别的元素的文本内容，但并不是所有浏览器都会，并且在这种情况下你的HTML将不是有效的HTML。

Answer 2

这就像是在说“如果我尊重英语的语法和语法会怎么样，那么可以用所有的词语来弥补？”虽然这种想法适用于good poetry，但它并不适用于技术领域;）

HTML有一组定义的标记valid。如果您使用任何组成的标签，它将无效。

现在，这并不意味着你无法逃脱它; on the World Wide Web forgiveness is the default所以如果你使用了你编写的标签，它就不会是世界末日......但它仍然是一个坏主意，因为你无法保证浏览器如何处理这些标签。

所以唯一真正的答案是“它对页面有什么影响，如果不是为元素使用ID或类，你只需创建自定义元素w / JS并用CSS对其进行样式化？”是任何可能发生的事情。 由于您使用的是非标准HTML元素，因此您最终会得到非标准结果，我们都不应该尝试和预测。

如果您真的想（和/或需要）使用自定义元素，请查看XML。在XML中，您可以“组合”您的标签，但仍然可以应用CSS并在浏览器中打开文档。

例如，保存以下两个文件，然后在浏览器中打开XML文件：

INDEX.XML

<?xml-stylesheet href="style.xml.css"?>
<example>
 <summary>
     This is an example of making up tags in XML, and applying a stylesheet so you can open the file in a browser.
 </summary>
 <main>
     <container>This is the stuff in the container</container>
 </main>
</example>

style.xml.css

summary {
    display:none;
}
main container {
    border:2px solid blue;
    background:yellow;
    color:blue;
}

Answer 3

HTML是一种定义的语言，元素和标签在格式中具有一定的含义。您不能发明新元素，不仅因为浏览器可能会不一致地呈现这些元素，而且因为文档的含义和结构变得无效。

您最好使用对您要传递的内容具有正确含义的元素。如果您需要通用容器进行样式设置，则正确的元素是div。有类似的元素也提供了一些语义含义。我建议检查HTML标签索引和HTML5医生，以帮助选择正确的元素。

听起来好像<div class="container">...</div>最接近您的简要说明所需。

Answer 4

如果自定义元素使您的HTML易于阅读和管理，请继续使用它们。

自从提出此问题以来，自定义元素已随同关联的JavaScript API一起添加到WHATWG HTML Living Standard中。一些Web组件框架已经在实现其中一些规范。它不再像2011年那样成为禁忌。（我记得在尝试使用新发布的HTML5元素时在Internet Explorer中处理DOM时遇到了一些不愉快的问题。）

撰写本文时（2018年11月），自定义元素已在几种主要浏览器中实现。但是，尽管blog post from 2015表示Edge团队“很高兴继续支持并为这一过程做出贡献，但MDN将Microsoft Edge列为尚未实现自定义元素。”

使用自定义HTML元素与使用/ ID或类的HTML元素

4 个答案:

INDEX.XML

style.xml.css