第二次作业

task 1：完成省城市的三级联动（包括湖南省），附代码和效果图。

<html>
<head>

<select id="province">
<option value="-1">请选择</option>
<select>
<select id="city"></select>
<select id="country"></select>
<script>
var provinceArr=['上海','江苏','河北','湖南'];
var cityArr=[['上海市'],['苏州市','南京市','扬州市'],['石家庄','秦皇岛','张家口'],['长沙市','株洲市','湘潭市','衡阳市','邵阳市','岳阳市','常德市','张家界市','益阳市','娄底市','郴州市','永州市','怀化市']];
var countryArr=[[['1','2','3','4']],
[['5','6','7','8','9'],['10','11','12','13','14'],['15','16','17']],
[['5','6','7','8','9'],['10','11','12','13','14'],['15','16','17']]
];
function createOption(obj,data){
for(var i in data){
var op=new Option(data[i],i);
obj.options.add(op);
}}
var province=document.getElementById('province');
createOption(province,provinceArr);
var city=document.getElementById('city');
province.onchange=function(){
city.options.length=0;
createOption(city,cityArr[province.value]);}
;
var country=document.getElementById('country');
city.onchange=function(){
country.options.length=0;
createOption(country,countryArr[province.value][city.value]);
};
province.onchange=function(){
city.options.length=0;
createOption(city,cityArr[province.value]);
if(province.value>=0){
city.onechange();
}else{
country.option.length=0;
}
};
</script>
</head>
<body>
</body>
</html>

task 2：移出数组arr中与2相等的元素，并生成一个新数组，不改变原数组。

 

 

<html>
<head>
<script>
var arr=[1,2,3,4,2,5,6,2,7,2];
var b=[];
i=0;
while(i<arr.length)
{head=arr[i];
if(head!=2)
b.push(head);
i++;}
for(i=0;i<b.length;i++)
document.write(b[i]+' ' );
</script>
</head>
<body>
</body>
</html>

　　

 

 task 3：编写函数实现单击change按钮，为div元素添加红色双线的边框。

 

<html>
<head>
    
   
    <style >
        div{
          
        }
    
      
    </style>
</head>
<body>
   <div id="joy">
      <p>123</p>
   </div>
   <button  onclick="myFunction()">change</button>
   <script >
    function  myFunction(){
        var Color = document.getElementById("joy");
        Color.style.border = "3px double red";
       
       
    }
    </script>
</body>
</html>

　　

 

 

心得：

作业做完后，与网上的完成的差别是很大的，编码格式都不是很规范，没有良好的编码习惯，会犯很多粗心的问题。

 

posted on 2019-10-16 17:25  kkkkkkkkkkkkkk  阅读(189)  评论(0)    收藏  举报

导航