为了提高网页的加载速度，减少服务器的压力。我们会采用javascript动态来创建html页面元素。好处是有的，但坏处也会相对而行。我们在创建html元素会存在一些浏览器兼容性的问题。主要表现于ie7 及其以下版本。以下对此进行问题 分析和处理。
?
/*
动态创建页面素时会存在一些兼容性的问题（仅存在于ie7 及更低的版本）
已知的一些问题：
1.不能设置动态创建的<iframe>? 元素的name属性
2.不能通过表单的reset()方法重设动态重建的<input>元素
3.动态创建的type特性值为reset的<button>元素重置不了表单
4.动态创建的一批name相同的单选/复选 按钮彼此毫无关系。name值相同的一组单选/复选 按钮本来应该用于表示同一选项的不同值，但动态创建的一批这种单选按钮之间却没有这种关系。
*/
?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
</body>
<script language="javascript" type="text/javascript">
?
//（一） 兼容 IE7以上或者其他浏览器
? /* var box1=? document.createElement("input");
?? box1.type="checkbox";
?? box1.name="age";
?? box1.value="20";
?? var box2=? document.createElement("input");
?? box2.type="checkbox";
?? box2.name="age";
?? box2.value="20";?
?? var box3=? document.createElement("input");
?? box3.type="checkbox";
?? box3.name="all";
?? box3.value="20";
?? document.body.appendChild(box1);
?? document.body.appendChild(box2);
?? document.body.appendChild(box3);
?? document.getElementsByName('all')[0].onclick=function(){
???? if(this.checked){
?????? var len= document.getElementsByName("age").length;
?????? for(i=0;i<len;i++){
??????? document.getElementsByName("age")[i].checked=true;
??? }
?? }else{
?????? var len= document.getElementsByName("age").length;
?????? for(i=0;i<len;i++){
??????? document.getElementsByName("age")[i].checked=false;
??? }
?? }???
?}*/
//（二） 兼容 IE7 及其以下的浏览器
?? /*var box1=? document.createElement("<input type=\"checkbox\" name=\"age\" value=\"21\" />");
?? var box2=? document.createElement("<input type=\"checkbox\" name=\"age\" value=\"22\" />");?
?? var box3=? document.createElement("<input type=\"checkbox\" name=\"all\" value=\"22\" />"); ;
?? document.body.appendChild(box1);
?? document.body.appendChild(box2);
?? document.body.appendChild(box3);
?? document.getElementsByName('all')[0].onclick=function(){
???? if(this.checked){
?????? var len= document.getElementsByName("age").length;
?????? for(i=0;i<len;i++){
??????? document.getElementsByName("age")[i].checked=true;
??? }
?? }else{
?????? var len= document.getElementsByName("age").length;
?????? for(i=0;i<len;i++){
??????? document.getElementsByName("age")[i].checked=false;
??? }
?? }???
?}?*/
?
//（三） 兼容各种浏览器的方法
var Sys = {};
var ua = navigator.userAgent.toLowerCase();
var s;
(s = ua.match(/msie ([\d.]+)/)) ? Sys.ie = s[1] :
(s = ua.match(/firefox\/([\d.]+)/)) ? Sys.firefox = s[1] :
(s = ua.match(/chrome\/([\d.]+)/)) ? Sys.chrome = s[1] :
(s = ua.match(/opera.([\d.]+)/)) ? Sys.opera = s[1] :
(s = ua.match(/version\/([\d.]+).*safari/)) ? Sys.safari = s[1] : 0;
if(parseInt(Sys.ie)<=7){
?? var box1=? document.createElement("<input type=\"checkbox\" name=\"age\" value=\"21\" />");
?? var box2=? document.createElement("<input type=\"checkbox\" name=\"age\" value=\"22\" />");?
?? var box3=? document.createElement("<input type=\"checkbox\" name=\"all\" value=\"22\" />"); ;
?? document.body.appendChild(box1);
?? document.body.appendChild(box2);
?? document.body.appendChild(box3);
?? document.getElementsByName('all')[0].onclick=function(){
???? if(this.checked){
?????? var len= document.getElementsByName("age").length;
?????? for(i=0;i<len;i++){
??????? document.getElementsByName("age")[i].checked=t
