Question

有时，将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" />

Answer 1

您需要提供实际有效的html代码才能正确创建。在您的示例中，您的span标记未关闭，这导致IE中评估时代码无效，而其他浏览器则倾向于自动修复它。

替换

new_object.wrapper = '<span id="adfasdfasdfwersadfas3rs">';

使用

new_object.wrapper = '<span id="adfasdfasdfwersadfas3rs"></span>';

This exemple在IE 7和8上完美运行

Answer 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：

要确保跨平台兼容性，必须使用代码段良好的。可以包含可以包含其他元素的标记带有结束标记。

您的HTML未与结束标记配对。

为什么以下创建DOM元素的方式不适用于IE7和IE8中的jQuery？

2 个答案: