標籤:
1 <!doctype html> 2 <html> 3 <head> 4 <!--聲明當前頁面編碼集(中文編碼《gbk,gb2312》,國際編碼《utf-8》)--> 5 <meta http-equiv="Content-Type" content="text/html";charset="utf-8"> 6 7 <title>HTML模版</title> 8 <meta name="keywords" content="關鍵詞,關鍵詞"> 9 <meta name="description" content="">10 <style type="text/css">11 *{margin:10 auto;padding:0}12 </style>13 <script type="text/javascript" src="jquery-1.11.3.min.js"></script>14 <script type="text/javascript">15 var ci1=[‘省1‘,‘省2‘,‘省3‘,‘省4‘];16 window.onload=function(){17 createCity1();18 }19 function createCity1(){20 var city1=document.getElementById(‘city1‘);21 //建立標籤,建立標籤必須是參數必須是標籤名22 var op=document.createElement("option");23 op.innerHTML="請選擇省份"24 city1.appendChild(op);25 // city1.appendChild("<option>請選擇省份</option>");這樣寫是錯的26 27 for(var i=0;i<ci1.length;i++){28 // for(var i in cil){ //用這種可能會出現瀏覽器不相容29 var op_in=document.createElement("option");30 op_in.innerHTML=ci1[i];31 city1.appendChild(op_in)32 }33 }34 $(function(){35 //這裡就體現了jquery的強大,append方法是直接在對象後面添加content,再進行編繹。這個很牛,36 $("#city2").append("<option>請選擇省份</option>");37 for(var i=0;i<ci1.length;i++){38 $("#city2").append("<option>"+ci1[i]+"</option>");39 }40 })41 // createCity1();42 </script>43 </head>44 <body>45 <select id="city1"></select>46 <select id="city2"></select>47 48 49 </body>50 51 </html>
比較javascript中的appendChild()和jquery中的append() 才知道什麼叫jqery真牛