jQuery html（）和自闭标签 [英] jQuery html() and self-closing tags

问题描述

使用jQuery html（）创建自闭元素时，会发生以下问题：

  $（'＃someId'） .html（'< li>< input type =checkbox/>< / li>'）
  

会创建

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

正确关闭< li> 标记而不是< input>

这似乎是一个来自于html中使用的innerHTML的问题（）函数。

我到处寻找并找到了解决方案，但页面不再可用，如您所见： http://dev.jquery.it/ticket/3378

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

解决方案

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

 < input type =checkbox> 
  

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

 < input type =checkbox/> 
  

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

$ b

html（） 使用 innerHTML 。在IE和其他浏览器中，这有问题，因为XHTML仍然被建模为HTML DOM。请参阅内部IE-HTML DOM仍不符合XHTML标准。

基本上，使用XHTML的原因很少。这是一个跨浏览器的噩梦。有关为什么参阅 XHTML - 为传统元素编写自闭标签不是坏习惯？，特别是第一个答案。

While creating self-closed elements with jQuery html() the following issue happens:

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

will create

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

It closes correctly the <li> tag but not the <input>

It seems to be an issue from innerHTML which is used in the html() function.

I have looked everywhere and found a solution for this but the page is not available anymore as you see in: http://dev.jquery.it/ticket/3378

Anybody knows how to fix this?

解决方案

To clarify, this is valid HTML:

<input type="checkbox">

and this is valid XML (including XHTML):

<input type="checkbox"/>

but it is not valid HTML. That being said, most browsers will probably accept it anyway (but the document will fail validation if that means anything to you).

html() uses innerHTML. In IE and possibly other browsers this has issues because XHTML is still modeled as an HTML DOM. See Internal IE-HTML DOM still isn’t XHTML compliant.

Basically, there is very little reason to use XHTML. It's a cross browser nightmare. For a detailed synopsis as to why see XHTML - Is writing self closing tags for elements not traditionally empty bad practise?, particularly the first answer.

这篇关于jQuery html（）和自闭标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！