<!—需要给div元素添加子元素
-->
<body>
<p>Hello
World</p>
<div
id="myDiv"></div>
</body>
//将<p>元素添加到div中。
document.getElementById(“myDiv”).innerHTML
=
“<p>我是新添加的子元素<p>”
上面的示例较简单，赋值给innerHTML的值可以是一个表单，可以是更长更复杂的html。
虽然innerHTML属性添加子元素很方便，但容易出错，很多教程
网上(如秒秒学)都不使用。更常用添加节点的方式，来添加子元素。这样更加准确和具体的描述了DOM的变化。如上述innerHTML的语句可以替换成：
var
myParaElement
=
document.createElement(“p”)
//创建p元素
var
myText
=
document.createTextNode(“我是文本节点！”)
//创建文本节点
myParaElement.appendChild(myText)
//将文本节点做为p元素的子节
document.getElementById(“myDiv”).appendChild(myParaElement)
//再将p元素做为子节点放在div元素下。
bug描述：在ie下面使用innerHTML来插入option选项的话，ie会去掉前面的<option>，并拆分成多个节点，这样会造成select的出错，不是没有插进去，而是节点在转换时出问题了，微软对这个bug也有描述，并提供了两个解决方案，大家可以自己搜索一下，我大概提下微软的两个方案。
1，使用createElement，这个是正规渠道，要出错还真有问题了。
2，插入完整的select字符串，到div中。
实现：
原理：
既然是使用innerHTML的人，肯定是想用字符串来插入option了，这里主要就是解决这人人群，当然你也可以传入createElement对象来插入。
对于传入的参数会做个判断，看是elementObj还是字符串，如果是elementObj那么就使用标准的add方法加入，并做兼容处理。如果是字符串则使用div包装完整的select并转换成dom对象用appendChild来加入。
注意：
b$.type.isElement(arg)是bBank里面用来判断对象是否是element元素的方法
b$.browser.isIE()是bBank里面用来判断是否是ie的方法
b$.parseDom(str)是bBank里面用来转换字符串为标准dom的方法
jquery可以利用parseHtml来 *** 作html字符串：
<html><head>
<script src="
$log = $( "#log" ),
str = "hello, <b>my name is</b> jQuery.",
html = $.parseHTML( str ),
nodeNames = [] // Append the parsed HTML$log.append( html ) // Gather the parsed HTML's node names$.each( html, function( i, el ) { nodeNames[i] = "<li>" + el.nodeName + "</li>"}) // Insert the node names$log.append( "<h3>Node Names:</h3>" )$( "<ol></ol>" ) .append( nodeNames.join( "" ) ) .appendTo( $log )
</script>
</body>
</html>
运行结果：
Content:
hello, my name is jQuery.Node Names:
#text
B
#text
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）