请各位牛人帮忙看看代码，已经写出来了但是有点问题，求指教！

妙味用户562037
2017-08-22 09:38

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>
<style>
body,h1,h2,h3,h4,h5,h6,p,dl,dd,ul,ol{margin:0;padding:0}em,i{font-style:normal}li{list-style:none}a,a:hover{text-decoration:none}img{border:0}table{border-collapse:collapse;border-spacing:0}label{cursor:default}body,button,input,select,textarea{font:16px/1.5 Tahoma,arial,'Hiragino Sans GB','microsoft yahei',\5b8b\4f53}textarea{resize:none}a,a:focus{outline:none}.clearfix:after{content:'\20';display:block;height:0;clear:both}.clearfix{*zoom:1}.clear{display:block;height:0;clear:both;font-size:0;line-height:0;overflow:hidden}.fl{float:left;display:inline}.fr{float:right;display:inline}.fn{float:none}.tl{text-align:left}.tr{text-align:right}.tc{text-align:center}.hide{display:none}.show{display:block}.mt10{margin-top:10px}.noBg{background:none!important}.noBorder{border:0!important}.yahei{font-family:'microsoft yahei'}.red{color:red}
/* 项目主体部分设置 */
#box{ width:500px; height:400px; position:relative; margin:0 auto}
#box img{ width:500px; height:400px; position:relative; text-align:center;}
#box span,#box p{ text-align:center}
#box a{ position: absolute; top:50%; display: block; width: 30px; height: 30px; font-size: 30px; line-height: 30px; color: #fff; background:rgba( 0,0,0,0.5); z-index: 2;}
#box a.next{right: 0;}
#box a.prev{left: 0;}
#box span{ position:absolute; top:5%;width:500px; left:0;}
#box p{ position:absolute; bottom:5%; width:500px;}
#box ul{ position: absolute;width: 100px;height: 15px;left: 40%;bottom: 10%;}
#box ul li{ margin-left: 10px;border-radius: 50%;background: #000;width: 15px;height: 15px;float: left; position: relative;}
#box ul li div{width: 50px; height: 50px; position: absolute; top:-50px; left: 0px;background: rgba(0,0,0,0.2); display: none;}
#box ul li div #img{width: 50px; height: 50px;display: inline-block; z-index: 5;}

#box ul .current{ background:#fff;}
</style>
<script>
window.err=function(){
    var oBox=document.getElementById('box');
    var aBtn=oBox.getElementsByTagName('a');
    var aImg=oBox.getElementsByTagName('img')[0];
    var aSpan=oBox.getElementsByTagName('span')[0];
    var aP=oBox.getElementsByTagName('p')[0];
    var aUl=oBox.getElementsByTagName('ul')[0];
    var aLi=oBox.getElementsByTagName('li');
    var aDiv=oBox.getElementsByTagName('div');
    var oImg=document.getElementById('img');

    var arrUrl=['images/01.jpg','images/02.jpg','images/03.jpg','images/04.jpg'];
    var arrText=['第一张图片','第二张图片','第三张图片','第四张图片'];
    var num = 0;
    // var Namber= 0;

    for(var i=0; i<arrText.length;i++){
        aUl.innerHTML +='<li><div><img id="img"/></div></li>'//这里这样写有问题吗
    };

    for( var i=0;i<aLi.length; i++){
       aLi[i].index=i;
       aLi[i].err=function(){
           aDiv[this.index].style.display='block';
           oImg.src=arrUrl[this.index];
       };
       aLi[i].err=function(){
           aDiv[this.index].style.display='none';
           oImg.src=arrUrl[this.index];//无法获取到这个图片的src
       };
   };
    // 数据初始化
    function fn1(){
      aImg.src= arrUrl[num];
      aSpan.innerHTML=1+num+'/'+ arrUrl.length;
      aP.innerHTML=arrText[num];
    };
    aLi[num].className='current'
    fn1()
   for( var i=0;i<aLi.length; i++){
       aLi[i].index=i;
       aLi[i].err=function(){
           num= this.index;
           fn1()
           for(var i=0;i<aLi.length; i++){
               aLi[i].className=''
           };
           aLi[this.index].className='current'
       };
   };
   aBtn[0].err=function(){
       for(var i=0;i<aLi.length; i++){//这样写判断当前的li的current可以吗
           aBtn[i].index=i;
           if(i != this.index){
               num=this.index
               alert(num)
           };
       };
       num --;//点击的时候不会-1
       if(num==-1){
           num=arrUrl.length-1;
       };
       fn1();

   };
   aBtn[1].err=function(){
       for(var i=0;i<aLi.length; i++){
           aBtn[i].index=i;
           if(i != this.index){
               num=this.index
               alert(num)
           };
       };
       num ++;//点击的时候不会+1
       aImg.src= arrUrl[num];
       aSpan.innerHTML=1+num+'/'+ arrUrl.length;
       aP.innerHTML=arrText[num];
   };
};
</script>
<body>
<div id="box">
   <a href="" class="prev"><</a>
   <a href="" class="next">></a>
   <img src="">
   <span>数量正在加载</span>
   <p>文字说明正在加载</>
   <ul></ul>
</div>
</body>
</html>

附件下载：

webzdg

自己看一看我注释了，明显刚学不久

附件下载：

2017-08-22 10:30 回复本帖

webzdg

webzdg 2017-08-22 10:30发表的内容:

自己看一看我注释了，明显刚学不久

你在点击事件里加上第num个LI的类名

2017-08-22 10:32 回复本帖

妙味用户562037

webzdg 2017-08-22 10:32发表的内容:

你在点击事件里加上第num个LI的类名

太谢谢您啦，十分感谢，其实基础部分我学的还不错，每当写的时候就脑子犯浑，以后会注意的，还是十分感谢您为我解决的问题！谢谢

2017-08-23 08:44 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 08:44发表的内容:

太谢谢您啦，十分感谢，其实基础部分我学的还不错，每当写的时候就脑子犯浑，以后会注意的，还是十分感谢您为我解决的问题！谢谢

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

2017-08-23 09:06 回复本帖

webzdg

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

这个是三目运算，判断num是否小于0结果为真执行？后面的语句为假执行：后的语句

2017-08-23 10:53 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

好的，谢啦，我懂了，这边我有个比较数值的时候遇到点问题，您能帮我解答一下吗？麻烦您了，我已经找到这些数字，但是不知道怎嘛比较大小，还有最后一个找出NAN，我的方法无法找到NAN

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert()
//    };
// };
//
// for(var i=0;i<arr.length;i++){
//    if( typeof(arr[i]) == NaN ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:15 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:17 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:17 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:17 回复本帖

妙味用户562037

妙味用户562037 2017-08-23 09:06发表的内容:

num = num<0?aLi.length-1:num;大神，这句话怎嘛解释，当num<0的时候?是判断这句话吗？还有后面的冒号：num

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

2017-08-23 14:17 回复本帖

webzdg

/*第三个*/
var num=[];
for(var i=0;i<arrNum.length;i++){
   num.push(parseInt(arrNum[i]))
}
var max=num[0]
for(var i=0;i<num.length;i++){
   if(max<num[i]){
       max = num[i]
   }
}

/*第四个*/
var lenArrIndex=[];
for(var i=0;i<arr.length;i++){
   if(typeof(arr[i])=='number'&&parseInt(arr[i])+''=='NaN'){
       lenArrIndex.push(i)
   }
}
console.log(lenArrIndex)

2017-08-23 15:00 回复本帖

webzdg

妙味用户562037 2017-08-23 14:17发表的内容:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

/*第三个*/
var num=[];
for(var i=0;i<arrNum.length;i++){
   num.push(parseInt(arrNum[i]))
}
var max=num[0]
for(var i=0;i<num.length;i++){
   if(max<num[i]){
       max = num[i]
   }
}

/*第四个*/
var lenArrIndex=[];
for(var i=0;i<arr.length;i++){
   if(typeof(arr[i])=='number'&&parseInt(arr[i])+''=='NaN'){
       lenArrIndex.push(i)
   }
}
console.log(lenArrIndex)

2017-08-23 15:00 回复本帖

webzdg

妙味用户562037 2017-08-23 14:17发表的内容:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

/*第三个*/
var num=[];
for(var i=0;i<arrNum.length;i++){
   num.push(parseInt(arrNum[i]))
}
var max=num[0]
for(var i=0;i<num.length;i++){
   if(max<num[i]){
       max = num[i]
   }
}

/*第四个*/
var lenArrIndex=[];
for(var i=0;i<arr.length;i++){
   if(typeof(arr[i])=='number'&&parseInt(arr[i])+''=='NaN'){
       lenArrIndex.push(i)
   }
}
console.log(lenArrIndex)

2017-08-23 15:00 回复本帖

webzdg

妙味用户562037 2017-08-23 14:17发表的内容:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

/*第三个*/
var num=[];
for(var i=0;i<arrNum.length;i++){
   num.push(parseInt(arrNum[i]))
}
var max=num[0]
for(var i=0;i<num.length;i++){
   if(max<num[i]){
       max = num[i]
   }
}

/*第四个*/
var lenArrIndex=[];
for(var i=0;i<arr.length;i++){
   if(typeof(arr[i])=='number'&&parseInt(arr[i])+''=='NaN'){
       lenArrIndex.push(i)
   }
}
console.log(lenArrIndex)

2017-08-23 15:00 回复本帖

webzdg

妙味用户562037 2017-08-23 14:17发表的内容:

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>

// for(var i=0;i<arr.length;i++){
//    if( parseFloat(arr[i]) == parseFloat(arr[i]) ){
//        alert(arr[i])
//    };
// };

</script>

</head>

因为NaN 不等于NaN

2017-08-23 15:02 回复本帖

妙味用户562037

webzdg 2017-08-23 15:02发表的内容:

因为NaN 不等于NaN

您好！打扰了，因为我是学设计的在学校自学的HTML+CSS，大概15年的时候就开始看妙味课堂的视频，但是每次遇到问题都被困在哪里，没法解决，就没法前进，所以2年了，还是个js小白，现在也会写一个静态页面，但是总是在网上下载别人的代码，然后自己改样式，我觉得这样很不好，刚好毕业了，也能静下心来学代码，所以白天在公司上班（也是做前端，但是非常简单的。）但是中午，晚上有时间的时候就会做例子，但是遇到问题总是没法解决，我感觉您很热心，而且技术也是非常棒！所以我能请您当我老师吗？这个是我私人qq：876728368；如果可以的话，万分感谢！！！如果不行的话，打扰您了，谢谢您为我解决的问题，再次感谢您！

2017-08-23 16:45 回复本帖