在我的课上,我玩了一下,发现CSS与虚构的元素一起工作。

例子:

imsocool { 颜色:蓝色; } < imsocool >你好< / imsocool >

当我的教授第一次看到我使用它时,他有点惊讶于虚构元素的工作,并建议我简单地将所有的虚构元素更改为带有ID的段落。

为什么我的教授不让我使用合成元素?他们工作效率很高。

另外,为什么他不知道存在虚构元素,并与CSS一起工作。它们不常见吗?


当前回答

...我只是简单地将我所有的自制标签更改为带有ID的段落。

我实际上不同意他关于如何正确做这件事的建议。

<p>标记用于段落。我看到人们一直在使用它而不是div——仅仅是为了空格的目的,或者因为它看起来更温和。如果不是一个段落,就不要用。 你不需要或想要把ID贴在所有东西上,除非你需要专门针对它(例如用Javascript)。使用类或直接使用div。

其他回答

现代浏览器将未知元素视为div。这就是它们有效的原因。这是即将到来的HTML5标准的一部分,该标准引入了模块化结构,可以向其中添加新元素。

在较老的浏览器(我认为是IE7-)中,你可以应用javascript技巧,之后它们也能正常工作。

下面是我在寻找例子时发现的一个相关问题。

这里有一个关于Javascript修复的问题。事实证明IE7确实不支持这些开箱即用的元素。

也;为什么他不知道自制标签的存在和CSS的工作。它们不常见吗?

是的,相当。但特别的是:它们没有额外的用途。他们是html5的新手。在HTML的早期版本中,未知标记是无效的。

Also, teachers seem to have gaps in their knowledge, sometimes. This might be due to the fact that they need to teach students the basics about a given subject, and it doesn't really pay off to know all ins and outs and be really up to date. I once got detention because a teacher thought I programmed a virus, just because I could make a computer play music using the play command in GWBasic. (True story, and yes, long ago). But whatever the reason, I think the advice not to use custome elements is a sound one.

人们很少使用自制的标记,因为它们不太可能在当前的每个浏览器和未来的每个浏览器中都可靠地工作。

浏览器必须将HTML代码解析为它所知道的元素,然后将生成的标记转换为适合文档对象模型(DOM)的其他内容。由于web标准没有涵盖如何处理标准之外的所有内容,web浏览器倾向于以不同的方式处理非标准代码。

在不增加不确定性元素的情况下,使用一堆不同的浏览器进行Web开发已经足够棘手了,这些浏览器都有自己的怪癖。最好的办法是坚持那些标准中的东西,那是浏览器供应商试图遵循的,所以它有最好的机会实际工作。

根据规格:

CSS

类型选择器是使用CSS限定名称语法编写的文档语言元素类型的名称

我以为这是元素选择器,但显然它实际上是类型选择器。规范继续讨论了CSS限定名称,它对名称的实际内容没有任何限制。也就是说,只要类型选择器匹配CSS限定名称语法,它就是技术上正确的CSS,并将匹配文档中的元素。对于特定规范(HTML或其他规范)中不存在的元素,没有特定于css的限制。

HTML

在文档中包含您想要的任何标签没有官方限制。但是,文档确实说了

作者不能将元素、属性或属性值用于其适当的预期语义目的以外的目的,因为这样做会妨碍软件正确处理页面。

然后它说

作者不能使用本规范或其他适用规范不允许的元素、属性或属性值,因为这样做会大大增加将来扩展该语言的难度。

我不确定具体在哪里或者规范是否说未知元素是允许的,但它确实谈到了HTMLUnknownElement接口的未知元素。有些浏览器甚至不能识别当前规范中的元素(我想到了IE8)。

虽然有一个自定义元素的草案,但我怀疑它还没有在任何地方实现。

关于其他的答案,有一些事情要么措辞不当,要么可能有点不正确。

FALSE(略):非标准HTML元素“不允许”、“非法”或“无效”。

不一定。他们“不合格”。有什么不同?有些东西可以“不符合”,但仍然是“允许的”。W3C不会派HTML警察到你家把你拖走。

W3C这样做是有原因的。一致性和规范是由一个团体定义的。如果恰好有一个较小的社区出于更特定的目的使用HTML,并且他们都同意一些他们需要的新元素以使事情变得更容易,他们可以拥有W3C所说的“其他适用规范”。(显然,这是一种过于简单的做法,但你可以理解)

也就是说,严格的验证器会将您的非标准元素声明为“无效”。但这是因为验证器的工作是确保符合它验证的任何规范,而不是确保浏览器或使用的“合法性”。

FALSE(略):非标准HTML元素将导致呈现问题

有可能,但不太可能。(将“will”替换为“might”)导致呈现问题的唯一方式是您的自定义元素与另一个规范冲突,例如对HTML规范的更改或同一系统内的另一个规范(如SVG、Math或其他自定义的东西)。

事实上,CSS可以样式化非标准标签的原因是因为HTML规范清楚地指出:

用户代理必须将它们不理解的元素和属性视为语义中立的;将它们留在DOM中(用于DOM处理器),并根据CSS(用于CSS处理器)对它们进行样式化,但不从中推断任何含义

注意:如果您想使用自定义标记,请记住稍后对HTML规范的更改可能会破坏您的样式,因此请做好准备。然而,W3C不太可能实现<imsocool>标记。

非标准标签和JavaScript(通过DOM)

您可以使用JavaScript访问和修改自定义元素的原因是,规范甚至讨论了如何在DOM中处理它们,DOM是允许您操作页面上元素的(非常可怕的)API。

htmllunknownelement接口必须用于本规范(或其他适用规范)未定义的HTML元素。

TL;DR:符合规范是为了沟通和安全的目的。除了验证器以外,其他任何方法都允许不一致性,验证器的唯一目的是强制一致性,但其使用是可选的。

例如:

var wee = document.createElement('wee');
console.log(wee.toString()); //[object HTMLUnknownElement]

(我确信这会引起争议,但这是我的2分)

其他人提出了很好的观点,但值得注意的是,如果你看看像AngularJS这样的框架,自定义元素和属性是非常有效的。它们不仅向xml传递更好的语义含义,而且还可以为web页面提供行为、外观和感觉。