js基础知识

js基础语法

变量和数据

函数

调用函数

    
    
    


    
    

        
    
    //按钮

参数传递

    
    
    


    
    按钮
    按钮

捕获异常

DOM操作html

    
    
    


    
Hello
    按钮
    

DOM操作CSS

    
    
    


    

    hello
    
    按钮
    

.div{
    width:100px;
    height:100px;
    background-color: red;
}

EventListener

    
    
    


    按钮
    

事件流

事件处理

直接处理html5文件

    
    
    


    

        按钮
    
    

DOM2级处理事件

创建对象

字符串对象

数组对象

合并数组

排序

添加与翻转

DOM操作HTML

    
    
    


    
Hello
    
Hello
    
Hello
    
Hello
    Hello
    aid2
    

        
1
        
2
        
3
    
    

        
div的p元素
    
    

Window对象

    
    
    

    按钮
    

计时器对象

    
    
    

    按钮
    按钮
    

    
    
    

    按钮
    

    

History对象

    
    
    


    跳转到bioindex
    按钮
    

    
    


    按钮
    

    
    
    


    跳转到bioindex
    跳转

    
    


    

        
        按钮
    
    

JS瀑布流实现

*{
    margin:0px;
    padding:0px;
}
#container{
    position:relative;
}
.box{
    padding:5px;
    float:left;
}
.box_img{
    padding:5px;
    border:1px solid #cccccc;
    box-shadow:0 0 5px  #cccccc;
    border-radius: 5px;
}
.box_img img{
    width:150px;
    height:auto;
}
.box_img img{
    width:150px;
    height:auto;
}

window.onload=function(){
    imgLocation("container","box");
    imgLocation("container","box");
    var imgData={"data":[{"src":"2.jpg"},{"src":"3.jpg"},{"src":"4.jpg"},{"src":"5.jpg"},{"src":"6.jpg"}]};
    window.onscroll=function(){
        if(checkFlag()){
            var cparent =document.getElementById("container");
            for(var i=0;i

面向对象

//使用函数构造器构造对象
function People(name){
    this._name=name;
}
People.prototype.say=function(name){
    alert("peo-hello"+this._name);
}
function Student(name){
    this._name=name;
}
Student.prototype=new People();
var superSsay=Student.prototype.say;
Student.prototype.say=function(){
    alert("stu-hello"+this._name);
}
var s=new Student("iwen");
s.say();

面向对象的闭包操作，实现信息的隐藏

//使用函数构造器构造对象
(function(){
    var n="ime";
    function People(name){
        this._name=name;
    }
    People.prototype.say=function(){
        alert("peo-hello"+this._name+n);
    }
    window.People=People;
}());

(function(){
        function Student(name){
            this._name=name;
        }
        Student.prototype=new People();
        var superSsay=Student.prototype.say;
        Student.prototype.say=function(){
            alert("stu-hello"+this._name);
        }
        window.Student=Student;
    }()
)
var s=new Student("iwen");
s.say();