JQuery的特性

什么是JQuery

根据JQuery官网的解释：jQuery 是一个高效、精简并且功能丰富的 JavaScript 工具库。其本质是一个封装了方法的js文件。

JQuery的特点

1. 各种方法名字简洁
   相对于原生js，jQUery的方法名字很短，特别是对DOM的操作的一些方法名，例如：获取元素的内容jQuery只需用html()或者text()即可，原生js需要使用innerHTML()或者innerText()，如此可见JQuery的api名字比原生js简洁很多。
2. 浏览器兼容
   原生js对于操作DOM一些浏览器的方法不同或者返回值不同，导致需要使用不同的方法去获取值，导致代码冗余。例如：childNodes()，在ie浏览器中将注释节点也计算在内，chrom浏览其中则不包含注释节点。
   jQuery在方法库内部对浏览器进行检测从而解决兼容问题，减少了编程人员的工作量，减少代码冗余。
3. 隐式迭代
   jQuery具有隐式迭代的功能，获取元素集合后，不用再使用循环遍历对其进行操作，减少代码冗余。

<ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>

 ul {
            width: 500px;
            height: 500px;
        }
        
        ul li {
            width: 120px;
            height: 120px;
            margin-top: 20px;
        }

 $("ul li").css("backgroundColor", "red");

由此可见即便没有通过for循环逐个设置li元素的背景颜色，每个li的背景颜色都被设置，也就是说jQuery中存在循环也就是隐式迭代。
4. 链式编程
jQuery可以进行链式编程，在执行一个方法后方法会返回一个jQuery对象，可以再次调用jQuery方法。但是并不是所有的方法执行后都可以再次调用jQuery方法，例如：text()该方法返回一个元素的内容并不是一个jQUery对象因此不能进行链式编程。

<ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>

 $("ul li").css("backgroundColor", "red").css("border", "5px solid #ccc");

由此可见，在设置背景颜色后可以才再次在后面设置边框样式，这就是链式编程。
5. 可以写多个入口函数
入口函数是jQuery的ready方法，该方法传入一个函数，该函数在DOM树渲染完毕后执行，避免由于资源加载缓慢从而导致js文件运行出错。jQuery的入口函数与原生相比，可以写多个并不会被覆盖，原生js会出现后写的覆盖先写的情况。

 $(document).ready(function() {
        console.log(1);
    });
    $(document).ready(function() {
        console.log(2);
    });

原生js

 window.onload = function() {
        console.log(1);
    }
    window.onload = function() {
        console.log(2);
    }

由此可见，jQuery可以写多个入口函数，而原生js会被覆盖。
6. 容错率高
原生js中，当一行代码出错后，该行代码之后的代码不会执行，即便后面的代码没有出错。jQuery并不会出现这种情况，jQuery中如果前面的代码中有错，并不会影响后面没有错误的代码的执行。

 window.onload = function() {
        console.log(ba);
        console.log(1);
    }

原生js前面的代码出错后，后面的代码不再执行

 $(document).ready(function() {
        console.log(ba);


    });
    $(document).ready(function() {
        console.log(1);
    });

jQuery前面的代码出错，只要后面的代码不出错仍然执行。
由此可以看出，jQuery比原生js的容错率更高。