jQuery的HTML（）和自闭标签

虽然与jQuery HTML创建自封闭元素（）以下问题发生：jQuery的HTML（）和自闭标签

$('#someId').html('<li><input type="checkbox" /></li>')

将创建

<li><input type="checkbox"></li>

它关闭正确<li>标签但不是<input>

它似乎是从html（）函数中使用的innerHTML问题。

我已经到处找，发现了一个解决方案，但该页面不存在了，因为你看到：http://dev.jquery.it/ticket/3378

任何人知道如何解决这一问题？

来源

2010-03-31 UXTE

你不能只将其更改为 $（ '＃someId'）HTML（ '

'） – Avitus 2010-03-31 23:59:21

你正在使用的。 XHTML关闭方法。这是你想要的还是只是HTML？ – dscher 2010-04-01 00:00:28

您不应该自我关闭html – theonlygusti 2018-02-10 09:29:13

为了澄清，这是有效的HTML：

<input type="checkbox">

，这是有效的XML（包括XHTML）：

<input type="checkbox"/>

但不是有效的HTML。话虽如此，大多数浏览器可能会接受它（但如果这对您来说意味着什么，文档将无法通过验证）。

html()使用innerHTML。在IE和其他浏览器中，这有问题，因为XHTML仍然被建模为HTML DOM。见Internal IE-HTML DOM still isn’t XHTML compliant。

基本上，使用XHTML的原因很少。这是一个跨浏览器的噩梦。关于为什么看到XHTML - Is writing self closing tags for elements not traditionally empty bad practise?的详细说明，特别是第一个答案。

来源

2010-03-31 23:57:38 cletus

我使用的是xhtml ... – UXTE 2010-03-31 23:59:20

但它不正确XHTML - “在XHTML中，标记必须正确关闭，像这样。” – dscher 2010-03-31 23:59:40

@Pedro我的建议是“不要使用XHTML”。这是一个跨浏览器的噩梦。见http://stackoverflow.com/questions/348736/xhtml-is-writing-self-closing-tags-for-elements-not-traditionally-empty-bad-pra – cletus 2010-04-01 00:01:00

在HTML5时代，人们可能会认为<input type="checkbox">和<input type="checkbox" />是同一个void元素的同等有效表示。

虽然这是真的，原因innerHTML仍然没有序列化的/>无效元素是双重的：

一个空元素是一个空元素，无论你如何它代表到浏览器。在浏览器构建元素时，它的标记是不相关的，就DOM而言，它是一个类型复选框的input元素。元素的“标签”唯一相关的地方是其tagName属性，以及even that has its own quirk。

有一个浏览器没有任何理由开始序列化空元素与/>语法时HTML5本身，由于是基于HTML，XML不是的，并不需要它。这样做仅仅是因为使用/>语法同样有效，因此不必中断与旧站点的兼容性，因为它们的绝对零增益（因为/>的存在不会以任何方式改变输出的含义）。这让我们回到cletus的区分HTML标记和XHTML标记的答案。

innerHTML，并且通过扩展jQuery.html()，旨在为您从DOM的元素的内容的HTML表示。它是而不是旨在为您提供浏览器用于在DOM中构建元素的HTML标记。你不能“修复”这个，因为没有什么可以解决的。你需要做的是避免依赖元素的innerHTML来进行除偶尔的调试会话之外的其他任何事情。

参见：Nested <p> tag auto-closing/opening

来源

2018-02-10 09:16:15 BoltClock

jQuery的HTML（）和自闭标签

回答

相关问题