初学JQ笔记

JQ全称JQuery 是一个开源的JS库，当我们的页面复杂到一定程度，代码量通常很大，JQ封装了很多功能，让我们可以直接调用，精简了很多代码，让我们开发更有效率。

引入方式
本地引入，从JQ官网下载下来，放到页面中。
<script src="js/jquery.min.js"></script>
还有一种方法是通过CDN方式在线引入。

$符号是JQuery的一个别称，JQuery是一个函数，而且还是一个
构造函数。
$()是一个类数组带有额外方法，比如$(string)

$('.header'); //将类名为header的元素转为Jquery对象。这
种类似QuerySelector的方法
$('<div></div>'); //生成一个div的Jquery对象

$(dom element)
//获取所有段落元素DOM
var newContent = document.getElementsByTagName('p');
var $newContent = $(newContent); //将DOM转成Jquery对象

一定要区别DOM对象和JQuery对象 ，并且两个对象是可以互相
转换
var $firstSay = $says.eq(0); //jq对象
var firstSay = $says[0]; //Dom
var secondSay = $says.get(1); //DOM

插入元素不同的对比
$('<div>123</div>')prependTo(document.body);

div = document.createElement('div');
divText = div.createTextNode('123');
div.appendChild(divText);
doucment.body.appendChild(div);

最常见的.parent()
.parents()
.children()
.find()
.eq()
.siblings()

获取父元素
$('#me').parent();
//获取所有父元素和祖宗元素
$('#me').parents();

//使用.eq()函数获取相应的元素
$('#me').parents().eq(0); //获取父级
$('#me').parents().eq(1); //获取父级的父级

//获取所有的兄弟元素
$('#me').siblings(); 多个
//通过使用selector来精确查找
$('#me').siblings('.tall'); selector

//使用.children()获取子元素
$('#grandPa').children();
//使用.find('*') 获取所有的子孙元素
$('#grandPa').find('*');

//使用.find(selector)精准获取子孙元素
$('#grandPa').find('.youngest')