2021-01-13

如何使用jQuery？
1、引入jQuery文件
2、写一个入口函数
3、找到要操作的元素（jQuery选择器），去操作它（属性、样式、文本）

$(document).ready(function(){
$('div').width(100).height(100).css('border','1px solid red').text('haha');
})

如何下载jQuery？
官网下载
版本区别 1.x 支持老浏览器--IE6、7、8 停止更新
2.x 不支持老浏览器 停止更新
3.x 不支持老浏览器 持续更新
右击链接另存为 2种---min 产品 ；不带 开发

jQuery入口函数
方法一

$(document).ready(function(){
...
})

方法二

$(function(){...})

入口函数的执行时机不同：

jQuery的入口函数快于window.onload----因为jQuery等待页面上的dom树加载完成，window.onload等待所有的资源都加载完后执行

jQuery的文件结构?

(function(){
  window.jQuery = window.$ = jQuery;
}());

jQuery文件是一个自执行函数，执行这个jQuery文件中的代码，其实就是执行这个自执行函数；
这个自执行文件就是给window对象添加一个jQuery属性和$属性；

$和jQuery是等价的，是一个函数

$是一个函数，参数传递不同，效果就不同

1、匿名函数--------入口函数
$(function(){});
2、字符串-----------选择器
$('#one') $('div')
3、DOM元素--------把DOM对象转为jQuery
$(DOM元素)

DOM对象---原生js选择器获取到的对象
dom对象只能调用dom的属性方法，不能调用jQuery的属性方法

jQuery对象---利用jQuery选择器获取到的对象
jquery对象是一个伪数组，其实就是dom对象的一个包装集
jQuery对象只能调用jQuery的属性方法，不能调用dom的属性方法
$('#one').css('background','green');

var ('#one');

案例

// 获取文本
 $('#getBtn').click(function(){
    // 获取到所有文本，包括后代文本
    $('#div1').text();
    // 设置内容
    $('#div1').text('你好');

    
})