为啥以下创建 DOM 元素的方式不适用于 IE7 和 IE8 中的 jQuery？
Posted
技术标签:
【中文标题】为啥以下创建 DOM 元素的方式不适用于 IE7 和 IE8 中的 jQuery？【英文标题】：Why does the following way of creating DOM elements not work with jQuery in IE7 and IE8?为什么以下创建 DOM 元素的方式不适用于 IE7 和 IE8 中的 jQuery？ 【发布时间】：2011-11-13 14:35:00 【问题描述】：有时，将 DOM 元素创建为 jQuery 对象以用作选择器和上下文很有用。
以下内容适用于两者 IE7、IE8 和所有其他使用 jQuery 1.6.2/3 的浏览器 - 但请注意 document.createElement 用于使这项工作在 IE7 和 IE8 中运行。
jQuery('body').append('<div id="basic-render-test"> </div>');
var new_object = ;
new_object.wrapper = '<span id="adfasdfasdfwersadfas3rs">';
//alert(typeof new_object.wrapper);
if (jQuery.browser.msie && jQuery.browser.version <= 8.0)
new_object.el = document.createElement(new_object.wrapper);
else
new_object.el = jQuery(new_object.wrapper);
new_object.render_into = "#basic-render-test";
jQuery(new_object.render_into).append( new_object.el );
some_html = '<DIV id="type-m" class="translate"> HELLO IE</DIV>';
jQuery(new_object.el).html( some_html );
声明的 DOM 类型是 HTML 5
<!DOCTYPE HTML>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
【问题讨论】：
【参考方案1】：您需要提供一个实际有效的 html 代码才能正确创建它。在您的示例中，您的 span 标签未关闭，这导致在 IE 中评估时代码无效，而其他浏览器倾向于自动修复它。
替换
new_object.wrapper = '<span id="adfasdfasdfwersadfas3rs">';
有
new_object.wrapper = '<span id="adfasdfasdfwersadfas3rs"></span>';
This exemple 在 IE 7 和 8 上都能完美运行
【讨论】：
此作品在 IE8 中将 "" 更改为 "" 效果很好（未在 IE7 中测试过） jQuery 文档api.jquery.com/jQuery/#jQuery2 中提到：“为了确保跨平台兼容性，sn-p 必须格式正确。可以包含其他元素的标签应与结束标签配对” 【参考方案2】：在查看 jQuery 代码时，如果您传递给 jQuery 函数的是一个简单的标签，例如 "<span>" 与您传递的内容，它会采用不同的代码路径。当它是一个简单的标签时，jQuery 调用createElement() on it, pretty much like your workaround code。当它不是一个简单的标签时，jQuery 会调用createDocumentFragment()，然后采用更复杂的路径，包括临时 div、将您的 HTML 设置为 innerHTML 等...
如果你让你的 HTML 成为一个简单的标签，然后在对象创建后添加 id 属性，它应该遵循 createElement 代码路径。
要解决此问题，请更改以下内容：
new_object.wrapper = '<span id="adfasdfasdfwersadfas3rs">';
到这里：
new_object.wrapper = '<span id="adfasdfasdfwersadfas3rs"></span>';
来自this jQuery documentation：
为确保跨平台兼容性，sn-p 必须是 格式良好。可以包含其他元素的标签应该配对 带有结束标记。
您的 HTML 未与结束标记配对。
【讨论】：
以上是关于为啥以下创建 DOM 元素的方式不适用于 IE7 和 IE8 中的 jQuery？的主要内容，如果未能解决你的问题，请参考以下文章
可拖动的 jQuery UI 不适用于新创建的 DOM 元素