第七节课-javascript的继承和jquery介绍

怼烎@ 2022-06-02 08:29 149阅读 0赞

> javascript的继承

*  如何继承某个构造函数的属性呢？通过原型来继承
    
        function Person(name){
               this.name= name;
         }
         Person.prototype.sayHello=function(){
           console.log("my name is "+this.name);
           }
        
         function Student (name,age,mark){
          this.age  = age;
          this.mark = mark;
        
          console.log(this.__proto__);
         //Object {constructor: function}
         //constructor:function Student(name,age,mark)
         //__proto__:Object
        
          this.__proto__ =  new Person(name);//父类构造函数赋值之后
        
          console.log(this.__proto__);
         //Person {name: "xiaoMing"}，现在子类的原型变成父类的构造函数，
         //子类没有自己的原型了，如果在子类构造函数外定义子类的其他方法就会报typeError错误。
         //例如 Student.prototype.study=function(){ console.log();} 会报错
        
         //下面这么写相当于在用父类构造函数来写子类想要实现的方法
          this.__proto__.study=function(){
          console.log("my name is "+this.name+",my age is " 
           +this.age+",my mark is "+this.mark);
           }
        }
         
         //再定义其他函数只能这么定义
        Person.prototype.sing=function (argument) {
         console.log("hello ");
        }
         //如果是Student.prototype.sing=function 这样会报TypeError错误
        
         var stu1 = new Student("xiaoMing", 5,89.0);
         stu1.sayHello();
         stu1.study();
         stu1.sing(); //hello
 *  jquery知识点介绍
 *  为什么要用到jquery呢？
    
     *  jquery 不仅有对象定位的能力，而且拥有统一浏览器兼容的能力，比 Dom Api 更加好用和强大。
     *  浏览器中堆空间中拥有大量的对象，可以认为是对象的海洋，那jquery可以简单的查询到适合需求的对象
     *  在jquery中，window.οnlοad=function()\{\} 这种方法在浏览器中兼容不是特别好，用jquery会自动适用全部的浏览器
 *  js 的主要工作
 *  定位内存中的网页元素
 *  执行操作（根据Dom Api）
 *  传统的内存定位方法
 *  getElementById()
 *  getElementsByTagName()
 *  getElementsByName()
 *  getElementsByClassName()
 *  了解用jquery获取页面元素div中的继承关系  
    div - HTMLDIVElement - HtmlElement - -----》 Node ----Object
 *  用jquery获取了多个div元素，要对每个div进行操作，怎么做？  
    for（var i =0； i<div.length ; i++ ）  
    ｛ if(i+1)%2 !=0 //这样是对奇数的求法｝  
    这么写会怎样呢？  
    for(var div in divs ) //这种不能进行每个div的操作，这种写法是属性遍历
 *  理解Wrapped set 的概念  
    通过jquery方法获取页面元素构成的元素集合
 *  jquery的几个小知识点简介  
    $("p").text("<b>hello world</b>") ; //没有显示粗体字体，都当作字符串输出  
    $("p").html("<b>hello world</b>") ; //有显示粗体字体
    
     *  jquery方法书写可以接着好多个
     *  jquery选择器学习  
        $("a\[href $=.jsp\]") //结尾为.jsp 的  
        $("a\[href \*=test\]") //包含有test
 *  位置选择器 ：伪类 ：：伪元素  
    $("p:even" ) //偶数，从0开始  
    $("p:odd" ) //奇数，从0开始  
    $("p:eq(3)" ) //偶数，从0开始
 *  相对位置选择器 相对与父亲
 *  自定义选择器  
    $("p:input" )  
    $("div Form.myForm :checkbox ：checked" )  
    $("div Form.myForm :checkbox ：not（：checked）" )
 *  对象转换的问题  
    如果是普通的html页面元素可以用js的DOm API  
    如果是jquery对象不能使用js的Dom 的API