在web頁面中，經常需要使用select控件來顯示div的顯示與隱藏，實現這個方法主要用到了setAttribute方法，以下為示例代碼
[html]?view plain?copy
- <html>??
- <title>通過選擇項顯示不同的結果</title>??
- <head>??
- <script?type="text/JavaScript">??
- function?showdiv()??
- {??
- ????var?doc=document;??
- ????var?citytext=doc.getElementById("city").value;??
- ????var?div1=doc.getElementById("div1");??
- ????var?div2=doc.getElementById("div2");??
- ????var?div3=doc.getElementById("div3");??
- ????switch?(citytext)??
- ????{??
- ????????case?"廣州":????????????
- ????????????div1.setAttribute("style","display");?????????????
- ????????????div2.setAttribute("style","display:none");??
- ????????????div3.setAttribute("style","display:none");??
- ????????????doc.getElementById("text1").value=citytext;??
- ????????????break;??
- ????????case?"南昌":??
- ????????????div1.setAttribute("style","display:none");??
- ????????????div2.setAttribute("style","display");??
- ????????????div3.setAttribute("style","display:none");??
- ????????????doc.getElementById("text2").value=citytext;??
- ????????????break;??
- ????????case?"沈陽":??
- ????????????div1.setAttribute("style","display:none");??
- ????????????div2.setAttribute("style","display:none");??
- ????????????div3.setAttribute("style","display");??
- ????????????doc.getElementById("text3").value=citytext;??
- ????????????break;??
- ????}??
- }??
- </script>??
- </head>??
- <body>??
- <select?title="城市"?id="city"?onchange="showdiv()">??
- <option?selected?value="廣州">廣州</option>??
- <option?value="南昌">南昌</option>??
- <option?value="沈陽">沈陽</option>??
- </select>??
- <div??id="div1"?style="display:none"??>您選擇了廣東的省會<input?type="text"?id="text1"?value=""/></div>??
- <div??id="div2"?style="display:none"??>您選擇了江西的省會<input?type="text"?id="text2"?value=""/></div>??
- <div??id="div3"?style="display:none"??>您選擇了遼寧的省會<input?type="text"?id="text3"?value=""/></div>??
- </body>??
- </html>??
![[No0000166]CPU的組成結構及其原理](http://pic.xiahunao.cn/[No0000166]CPU的組成結構及其原理)
函數)
