jQuery笔记-1

（仅供自己复习）

jQuery入门

1 jQuery入口函数

以隐藏盒子为例

//1.页面DOM加载完毕再执行js代码
	$(document).ready(function()){
		$('div').hide();
})

 $(function(){
	$('div').hide();
})

两种方式相同 等着dom结构渲染完毕可执行内部代码，不必等所有外部资源加载完成，jq帮助完成了封装， 相当于原生js中的DOMContentLoaded.

2. jQuery对象和DOM对象的区别

jQ对象的本质是，利用$对DOM对象包装后产生的对象（为数组形式存储）

//1.DOM对象 用原生js获取过来的对象就是DOM对象
        var myDiv = document.querySelector("div");//myDiv 是DOM对象
        console.log(myDiv);
//2.jQuery对象 只能使用jq方法
		$('div');

注意：jQ对象只能使用jQ方法，DOM对象则使用原生js属性和方法

3 jQuery DOM对象转换

//js->jq
var myvideo = document.querySelector('video');
myvideo.play();
$(myvideo).play();//jq没有play这个方法
//jq->js
$('video')[0].play();//   $('video')[index]  或 $('video').get(index)
$('video').get(0).play();

4 常用API

原生js获取元素方式很多 jQuery做了封装 使获取元素统一标准

$("选择器") //里面直接写css选择器即可

ID选择器 #id
全选择器 *
类选择器 .class
标签选择器 div
并集选择器 div,p,li
交集选择器 li.current
(简略模式 具体用法是 $("#id"))

子代选择器 ：$("ul>li") //获取亲儿子层级元素 不会获取孙子层级元素 后代选择器：$("ul li") //获取ul下的所有li 包括子孙.

隐式迭代

jQuery设置样式：$('div').css('属性','值')
遍历内部DOM元素（为数组形式存储）的过程就叫隐式迭代，把匹配的所有元素进行遍历循环，给每一个元素添加css这个方法 ，不需要用for循环遍历