【问题标题】:Can the <figcaption> be used without its parent <figure> element?<figcaption> 可以在没有其父 <figure> 元素的情况下使用吗?
【发布时间】:2021-06-18 15:55:22
【问题描述】:
  1. 有谁知道figcaption 元素是否可以在没有其父figure 元素的情况下使用?

  2. 这样做有什么好处和坏处?有没有推荐的选项?

  3. 最后,您能否通过指向可靠资源的链接来支持您的答案?

【问题讨论】:

  • 来自 MDN:developer.mozilla.org/en-US/docs/Web/HTML/Element/figcaption 允许的父母:&lt;figure&gt; 元素; &lt;figcaption&gt; 元素必须是它的第一个或最后一个子元素。这是在 Stack Overflow 上提问之前需要完成的基础研究。
  • 好的,感谢您的快速回复,我之所以问,是因为我看到一个朋友使用 figcaption 没有数字元素,我想知道这是否会是一个问题或只是不好的做法。有什么想法吗?

标签: html parent figure figcaption


【解决方案1】:

the specification:

可以使用此元素的上下文:
作为图形元素的第一个或最后一个子元素。

【讨论】:

  • 好的,感谢您的快速回复,我之所以问,是因为我看到一个朋友使用 figcaption 没有数字元素,我想知道这是否会是一个问题或只是不好的做法。有什么想法吗?
  • 这是个问题。不要这样做。编写有效的语义 HTML。
  • 和我想的一样,谢谢!
【解决方案2】:

您的问题基本上是“如果我将 HTML 元素放在它不属于每个规范的上下文中会出现什么问题?”

嗯,这取决于您对“问题”的定义,显然最好的做法是永远不要让它发生并首先坚持“有效”的 HTML 结构,但您的好奇心也是有效的,当然值得探索。

你可能暗示错误放置的标签总是会被解释不知何故——在这种情况下 (figcaption) 甚至会作为 DOM 中的块级元素保留,所以你仍然可以即使没有标准 &lt;figure&gt; 父级,也可以从 JS 中对其进行样式设置和处理。

在这种特殊情况下,您有可能永远不会遇到严重的问题。您甚至可以查阅规范并查看错误处理,并发现此类“糟糕”场景大多已定义行为 WRT DOM 构造;例如,&lt;body&gt;&lt;figcaption&gt;foo&lt;/figcaption&gt; 将(可能)生成带有文本 'foo' 的 figcaption 元素,而 &lt;body&gt;&lt;table&gt;bar&lt;/table&gt; 将在 body 元素中生成文本 'bar',然后是空的 table 元素。问题是这些规则真的很复杂,尽管这些规范在用户代理中的实现毕竟可能会有很大差异,所以在你在所有设备上测试你的应用程序之后,你最终会不确定在你没有测试过的设备上可能会出现什么问题:

  • 可能某些全文索引机器人在解析您的代码时会崩溃并丢弃您的页面或其索引中的一部分,
  • 在搜索不存在的图像时,某些辅助技术可能会挂起,因为流浪&lt;figcaption&gt; 让您的用户处于敌对空间,
  • 也许您会偶然发现不知道如何切换其显示的 JavaScript 库,而您最终会使用内联显示而不是块显示,
  • 或者您将包含 CSS 库,该库设置暗示相对图形包装器的绝对位置,因此您最终会在页面底部的所有杂散图形标题一个接一个。

这些只是我想到的几个假设场景。关键是不要给他们机会发生显然更好。

【讨论】:

    猜你喜欢
    • 2012-11-23
    • 2012-08-03
    • 1970-01-01
    • 2012-03-21
    • 2013-05-28
    • 2015-12-27
    • 2011-02-15
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多