jQuery（pink）学习笔记一

目标1

Javascript库：

封装好的特定集合（方法和函数）

jQuery目的

为了快速方便的操作DOM
同样的还有Prototype、移动端的zepto

jQuery的优点

jQuery的引入

1. 官网复制粘贴开发适用版本，占内存更小。自己新建文件例：jQuery.min.js
2. 引入新建文件

<script src="../js/jQuery.min.js"></script>

3. 注意点：先有dom元素，再有相关操作

jQuery的入口函数

函数、方法的使用：函数名+（）

$是jQuery的别称

jQuery对象和DOM对象

区别

1. jQuery对象的本质：通过$把DOM元素（原生js获取的）进行了包装

 <script>
        var myDiv = document.querySelector('div');
        console.dir(myDiv);
        $('div');
        console.dir($('div'));
 </script> 

2. jQuery对象只能使用jQuery方法，DOM对象则使用原生js属性和方法。
   转换
   理由：将jQuery对象转换为DOM对象拥有更多所需要的属性、方法

<script>
        // 已有DOM对象，$(无需"")
        // 已有jQuery对象到DOM对象（加序号）
        $('video')[0].play();
</script>    

jQuery的API（应用程序编程接口）

目标2

console

console是用于显示js和DOM对象信息的单独窗口。向js中注入一个console对象，使用该对象可以输出信息到console窗口
主要用来调试

所有的层级选择器

jQuery隐式迭代pk原生js

    <div>月亮不会奔你而来</div>
    <div>月亮不会奔你而来</div>
    <div>月亮不会奔你而来</div>
    <div>月亮不会奔你而来</div>
    <script>
        $("div").css("background","pink")
        // 原生js是.style非.css
    </script>

区别：给匹配的所有元素进行循环遍历，执行相应的方法，而不用我们再进行循环（原生js要），简化我们的操作，方便我们调用

jQuery筛选选择器PK筛选方法（函数）

.find相当于子代选择器
通过“如何选择第n元素”，认识选择器和方法的区别
方法的索引可以用变量

资料源自网络，侵权必删