前端基本功：JS必记知识点+案例（三）

判断用户输入事件

正常浏览器 : oninput
Ie 678 支持的 ： onpropertychange
案例：

淘宝案例.gif

    
    
    
    




      
      必败的国际大牌  //当我们点击label 的时候 光标回到input里面。

数组array

数组： 就是一个大变量， 它里面可以存储很多的值。

• 声明数组

var arr = [1,3,5,7,9];
   var arr = new Array(1,3,5);

• 使用数组
  使用的方法: 数组名[索引值]; 函数名();
  索引号是从0开始的。 0 1 2 3 4 5 ...

var textArr = ["刘备","诸葛亮","赵云","关羽"];
console.log(textArr[3])

• 数组的长度
  数组名.length;

console.log(textArr[i]);

• 遍历数组

for(var i= 0,len =textArr.length; i

想到了for 遍历 数组
getElementsByTagName() 得到一个伪数组

案例：隔行变色

x.gif

源码 ：

     
     
      
   



    

        
 上证指数364110-50.16% 
        
上证指数364110-50.16% 
       
        
 上证指数364110-50.16% 
        
 上证指数364110-50.16%
       
        
上证指数 364110-50.16%
        
        
 上证指数364110-50.16%
        
        
上证指数364110-50.16% 
        
        
上证指数364110-50.16% 
       
        
上证指数364110-50.16%
       
        
上证指数364110-50.16%
 


 
       

数组求平均数：

求平均数

字符相连

数值相加 字符相连
1+1 = 2;
“你好” + “吗” “你好吗”
“你好” + 2 “你好2”

“0” + 10 “010”
10 - “2” 8
所有的input 取过来的值 是 字符型。

三元运算符 三目运算符

一元： a++ b++ +a -a
二元: a+b a>=b
三元: 表达式 ? 结果1 : 结果2 等价于 if else
如果表达式结果为真 ， 则返回 结果1
如果表达式结果为假， 则返回结果2
if(3>5) {alert(“11”)} else { alert(22)} ==
3>5 ? alert(11) : alert(22)

排他思想☆☆☆☆☆

排他思想:
首先干掉所有人， 剩下我自己、
案例：

排他并相应指示.gif

    
    
    
    


思想原理
思想原理
思想原理
思想原理
思想原理
思想原理

变量 和属性

变量

是独立存在的 自由自在的

属性和方法

属于某个对象的 属性和 方法

例如：

面试常考点TAB切换案例：

TAB切换案例.gif

源码：

    
    
    
    



     

            第一个
            第二个
            第三个
            第四个
            第五个
        
        

              
1好盒子
              
2好盒子
              
3好盒子
              
4好盒子
              
5好盒子
        

进一步精简源码：

    
    
    
    



     

            第一个
            第二个
            第三个
            第四个
            第五个
        
        

              
1好盒子
              
2好盒子
              
3好盒子
              
4好盒子
              
5好盒子