1 <!doctype html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>无标题文档</title> 6 7 <script> 8 //自定义框架 9 (function(){ 10 //命名空间的定义 11 if(!window[‘cwy‘]){ 12 window[‘cwy‘]={}; 13 } 14 function $(id){ 15 return document.getElementById(id); 16 } 17 window[‘cwy‘][‘$‘]=$; 18 19 //清除元素 20 function ClearElement(e){ 21 if(e.length<=0) 22 return; 23 var length=e.length; 24 for(var idx=length;idx>0;idx--) 25 e.options[idx-1]=null; 26 //length=e.length; 27 } 28 window[‘cwy‘][‘ClearElement‘]=ClearElement; 29 30 //更新元素 31 function UpdateElement(e,e_array){ 32 var length=e.length; 33 if(length!=0){ 34 ClearElement(e); 35 } 36 for(var idx=0;idx<e_array.length;idx++) 37 e.options[idx]=new Option(e_array[idx]); 38 //length=e.length; 39 } 40 window[‘cwy‘][‘UpdateElement‘]=UpdateElement; 41 })(); 42 43 window.onload=function(){ 44 45 var n1=[‘语文‘,‘数学‘,‘英语‘,‘政治‘,‘历史‘,‘地理‘]; 46 var n2=[‘语文‘,‘数学‘,‘英语‘,‘物理‘,‘化学‘,‘生物‘]; 47 var subject=cwy.$(‘subject‘); 48 subject.onchange=function(){ 49 switch(subject.value){ 50 case ‘wen‘:cwy.UpdateElement(cwy.$(‘book‘),n1);break; 51 case ‘li‘:cwy.UpdateElement(cwy.$(‘book‘),n2);break; 52 default:cwy.CleaeElement(cwy.$(‘book‘));break; 53 } 54 /*if(subject.value==‘wen‘) 55 cwy.UpdateElement(cwy.$(‘book‘),n1); 56 else if(subject.value==‘li‘) 57 cwy.UpdateElement(cwy.$(‘book‘),n2); 58 else 59 cwy.ClearElement(cwy.$(‘book‘));*/ 60 } 61 } 62 63 </script> 64 65 </head> 66 67 <body> 68 <select id="subject"> 69 <option value="">--请选择科目--</option> 70 <option value="wen">文科</option> 71 <option value="li">理科</option> 72 </select> 73 <select id="book"> 74 </select> 75 </body> 76 </html>
原文：http://www.cnblogs.com/dashen/p/3895344.html
