您的位置:首页 > 移动开发

比较javascript中的appendChild()和jquery中的append() 才知道什么叫jqery真牛

2015-11-30 21:25 369 查看
<!doctype html>
<html>
<head>
<!--声明当前页面编码集(中文编码《gbk,gb2312》,国际编码《utf-8》)-->
<meta http-equiv="Content-Type" content="text/html";charset="utf-8">

<title>HTML模版</title>
<meta name="keywords" content="关键词,关键词">
<meta name="description" content="">
<style type="text/css">
*{margin:10 auto;padding:0}
</style>
<script type="text/javascript" src="jquery-1.11.3.min.js"></script>
<script type="text/javascript">
var ci1=['省1','省2','省3','省4'];
window.onload=function(){
createCity1();
}
function createCity1(){
var city1=document.getElementById('city1');
//创建标签,创建标签必须是参数必须是标签名
var op=document.createElement("option");
op.innerHTML="请选择省份"
city1.appendChild(op);
//        city1.appendChild("<option>请选择省份</option>");这样写是错的

for(var i=0;i<ci1.length;i++){
//        for(var i in cil){   //用这种可能会出现浏览器不兼容
var op_in=document.createElement("option");
op_in.innerHTML=ci1[i];
city1.appendChild(op_in)
}
}
$(function(){
//这里就体现了jquery的强大,append方法是直接在对象后面添加content,再进行编绎。这个很牛,
$("#city2").append("<option>请选择省份</option>");
for(var i=0;i<ci1.length;i++){
$("#city2").append("<option>"+ci1[i]+"</option>");
}
})
//    createCity1();
</script>
</head>
<body>
<select id="city1"></select>
<select id="city2"></select>

</body>

</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: