各种问题,求助!

来源:10-1 编程挑战

AaronWell

2016-12-02 18:54

window.onload=function(){
    var ul=document.getElementById("ul1");   
    var li=ul.getElementsByTagName("li");
    var divv=document.getElementById("body");
    var div=divv.getElementsByTagName("div");
    for(var i=0;i<li.length;i++){
        li[i].index=i;
        li[i].onmouseover=function(){
            for(var j=0;j<div.length;j++){
                div[j].className="hide"
                li[j].style.borderTop="";
                li[j].style.borderBottom="none" ;
            }            
            div[this.index].className="show";
            li[this.index].style.borderTop="2px solid #8B4513"
            li[this.index].style.borderBottom="2px solid #ffffff" ;
        }  
    }   
 }



--------------------------------------------------------------问题1----------------------------------------------------------

window.onload=function(){
    var ul=document.getElementById("ul1");   
    var li=ul.getElementsByTagName("li");
    var divv=document.getElementById("body");
    var div=divv.getElementsByTagName("div");
    for(var i=0;i<li.length;i++){
        li[i].onmouseover=function(){
            for(var j=0;j<div.length;j++){
                div[j].className="hide"
                li[j].style.borderTop="";
                li[j].style.borderBottom="none" ;
            }            
            div[i].className="show";
            li[i].style.borderTop="2px solid #8B4513"
            li[i].style.borderBottom="2px solid #ffffff" ;
        }  
    }   
 }


去掉index这些为什么就不能了,index实现了什么功能?


--------------------------------------------------------------问题2----------------------------------------------------------


window.onload=function(){

    document.write("I");

    var ul=document.getElementById("ul1");   
    var li=ul.getElementsByTagName("li");
    var divv=document.getElementById("body");
    var div=divv.getElementsByTagName("div");
    for(var i=0;i<li.length;i++){
        li[i].index=i;
        li[i].onmouseover=function(){
            for(var j=0;j<div.length;j++){
                div[j].className="hide"
                li[j].style.borderTop="";
                li[j].style.borderBottom="none" ;
            }            
            div[this.index].className="show";
            li[this.index].style.borderTop="2px solid #8B4513"
            li[this.index].style.borderBottom="2px solid #ffffff" ;
        }  
    }   
 }

为什么加了一个document.write("i"),就只显示i,其他都没了?


--------------------------------------------------------------问题3----------------------------------------------------------


window.onload这里为什么没有就不行?


写回答 关注

2回答

  • 袋鼠大侠
    2016-12-02 20:18:53

    第一个问题:通过index把<li>和<div>对应起来,且index作为<li>的一个属性,问题1的写法,我猜应该是i的作用域的问题。

    第二个问题:

    第三个问题:window.onload相当于网页的初始化程序,给每个<li>赋一个onclock属性。

    AaronW...

    问题1中,为什么不能直接用i,需要用到this?

    2016-12-04 13:22:03

    共 1 条回复 >

  • 袋鼠大侠
    2016-12-02 20:18:50

    第一个问题:通过index把<li>和<div>对应起来,且index作为<li>的一个属性,问题1的写法,我猜应该是i的作用域的问题。

    第二个问题:

    第三个问题:window.onload相当于网页的初始化程序,给每个<li>赋一个onclock属性。

JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468061 学习 · 21891 问题

查看课程

相似问题