2021-08-07 04任务

最新推荐文章于 2021-12-01 23:38:55 发布

置顶 bj21002000

最新推荐文章于 2021-12-01 23:38:55 发布

阅读量108

点赞数

本文链接：https://blog.csdn.net/bj21002000/article/details/119494562

版权

该博客介绍了如何使用HTML、CSS和JavaScript实现网页上的动态图片轮播效果，以及如何创建一个三级联动的下拉菜单。动态轮播图每5秒自动切换图片，并通过JavaScript进行无缝衔接。同时，展示了使用JavaScript动态加载和更新下拉菜单内容，根据用户在省份、城市、区县的选择，实时更新下拉选项，实现了数据的联动交互。

摘要由CSDN通过智能技术生成

任务一：

<!DOCTYPE html>
<style>
div {
    position:relative;
    left:500px;
    top:150px;
}
</style>
<body   onload="displayImage()" >    
    <div >
        <img  id="tupian" src="  " >
    </div>
</body>

<script>


var imglist = new Array("1.jpg","2.jpg", "3.jpg");


var nCurImg = -1;
function displayImage()
{
++nCurImg;
if (nCurImg == imglist.length)
nCurImg = 0;

document.all("tupian").src = imglist[nCurImg];

setTimeout("displayImage()",5); //every 5 seconds
}

</script>

任务二

<!DOCTYPE -->
<HTML>
<head>
<meta="utf-8">
<style>
.father{
      width: 900px;
      position: absolute;
      display: flex;
      left: 50%;
      top: 20px;
      margin: 0 0 0 -450px;
      justify-content: center;
      align-items: center;
    }

</style>



</head>

<body>
    <div id="father">
        <select name="" id="sheng" onclick="sheng_change(this)">
          <option value="-1">- 省份 -</option>
        </select>
        <select name="" id="shi" onclick="shi_change(this)">
          <option value="-1">- 市 -</option>
        </select>
        <select name="" id="qv" onclick="qv_change()">
          <option value="-1">- 区 -</option>
        </select>
      </div>
      
      <script>
        var sheng = document.getElementById("sheng");
        var shi = document.getElementById("shi");
        var qv = document.getElementById("qv");
        function sheng_change(that){
            shi.innerHTML = "<option value=\"-1\">- 市 -</option>"
            qv.innerHTML = "<option value=\"-1\">- 区 -</option>"
            try{
                now_option = that.options[that.selectedIndex].value
                var si = datas[now_option].si
                var si_opts = new Array();
                si.forEach(function (val,idx,arr){
                    opt_si = document.createElement('option')
                    opt_si.innerText = val.si_name
                    opt_si.value = idx
                    shi.appendChild(opt_si)
                })
            }
            catch (e) {
            }
  
            function shi_change(that){
          qv.innerHTML = "<option value=\"-1\">- 区 -</option>";
          try{
              father_option = sheng.options[sheng.selectedIndex].value
              now_option = that.options[that.selectedIndex].value
              var xian = datas[father_option].si[now_option].xian_name
              xian.forEach(function (val,idx,ary) {
                  opt_xian = document.createElement('option')
                  opt_xian.innerText = val
                  opt_xian.value = idx
                  qv.appendChild(opt_xian)
              })
          }
          catch (e) {

          }
      }
      function qv_change(){
      }
      datas = [
            {
                'sheng':'省1',
                'si':[
                    {
                        'si_name':'a市1',
                        'xian_name':['a县1','a县2']
                    },
                    {
                        'si_name':'b市1',
                        'xian_name':['b县1','b县2']
                    }
                ]

            },
            {
                'sheng':'省2',
                'si':[
                    {
                        'si_name':'c市1',
                        'xian_name':['c县1','c县2']
                    },
                    {
                        'si_name':'d市1',
                        'xian_name':['d县1','d县2']
                    }
                ]

            },
      ]
      //省份数据
      var sheng_data = new Array();
      sheng_data={"北京市","天津市"};
      //获得省份数据
      datas.forEach(function (val,idx,arr){
          sheng_data.push(val.sheng)
      })
      //创建省份标签
      create_option(sheng,sheng_data)
      //创建点击事件`在这里插入代码片`
      function option_click(){
          console.log(1)
      }
      //创建option标签函数
      function create_option(father,data){
          data.forEach(function (val,idx,arr){
              var opt = document.createElement("option")
              opt.innerText = val
              opt.value=idx
              opt.onclick = option_click
              father.appendChild(opt)
          })
      }
</script>
</body>
</html>

自测题：
1 `

2堆和栈的区别：1、栈由系统自动分配，而堆是人为申请开辟；2、栈获得的空间较小，而堆获得的空间较大；3、栈由系统自动分配，速度较快，而堆一般速度比较慢；4、栈是连续的空间，而堆是不连续的空间。

3 var a=1;
var b=2;
var temp;
temp=a;
a=b;
b=temp;
%%%%%%%%%%%%%%%%%%%%%
var a=1;
var b=2;
a=a+b;
b=a-b;
a=a-b;
%%%%%%%%%%%%%%%%%%%%%
var a= 1;
var b = 2;
a= a^ b;
b= a^ b;
a= a^ b;
4 `

5 ` `

6 `

return -1

}

bj21002000

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
2021-08-07 04任务

任务一：<!DOCTYPE html><style>div { position:relative; left:500px; top:150px;}</style><body onload="displayImage()" > <div > <img id="tupian" src=" " > </div></body>&l
复制链接

扫一扫