jQuery如何获取元素

jQuery的基本设计思想和主要用法，就是”选择某个页面元素，然后对其进行某种操作”。这是它区别于其他JavaScript库的根本特点
使用jQuery的第一步，往往就是将一个选择表达式，放进和构造函数jQuery()（简写$），然后得到被选中的元素

可以通过以下方式获取元素
1.选择表达式可以是CSS选择器

$(document)//选择整个文档对象
$('#test')//选择id为test的网页元素
$('div.red')//选择class为red的div元素
$('input[name=first]')//选择name属性等于first的input元素

2.也可以是jQuery特有的表达式

$('a:first')//选择网页中第一个a元素
$('tr:odd')//选择表格的奇数行
$('#myForm :input')//选择表单中的input元素
$('div:visible')选择可见的div元素
$('div:gt(2)')//选择所有div元素，除了前三个
$('div:animated')选择当前处于动画状态的div元素

jQuery的链式操作是怎样的

jQuery最令人称道、最方便的特点就是链式操作。它的原理在于每一步的jQuery操作，返回的都是一个jQuery对象，所以不同操作可以连在一起。
比如：

$('div').find('h3').eq(2).html('Hello')

分解开来，就是下面这样

$('div')//找到div元素
    .find('h3')//选择其中的h3元素
    .eq(2)//选择第三个h3元素
    .html('Hello')//将它的内容改为Hello

jQuery如何创建元素

$('<div><span>1</span></div>')//新增元素
$('<div><span>1</span></div>').addpendTo(...)//appendTo可以把新增的元素放在另一个元素里，例如放在body里
$('<div><span>1</span></div>').addpendTo(document.body)

jQuery如何移动元素

jQuery提供两组方法来操作元素在网页中的位置移动。一组方法是直接移动该元素，另一组方法是移动其他元素，使其目标元素达到我们想要的位置
第一种方法是使用.insertAfter()，把div元素移动p元素后面

$('div').inserAfter($('p'))

第二种方法是使用.after()，把p元素加到div元素前面

$('p').after($('div'))

表面上看，这两种方法的效果是一样的，唯一不同的似乎只是不同的操作视觉。但实际上，它们有一个重大的差别，就是返回的元素不一样。第一种方法返回div元素，第二种方法返回p元素。

使用这种模式的操作方法，一共有四对

.insertAfter()和.after()：在现存元素的外部，从后面插入元素
.insertBefore()和.before()：在现存元素的外部，从前面插入元素
.appendTo()和.append()：在现存元素的内部，从后面插入元素
.prependTo()和.prepend()：在现存元素的内部，从前面插入元素

jQuery如何修改元素的属性

jQuery还有一个特点，就是使用同一个函数，来完成取值（getter）和赋值（setter），即“取值器”与“赋值器”合一。到底是取值还是赋值，由函数的参数决定

$div.text(?)读写文本内容
$div.html(?)读写HTML内容
$div.attr('title',?)读写属性
$div.css({color:'red'})读写style
$div.addClass('blue')
$div.on('click',fn)
$div.off('click',fn)

需要注意的是，如果结果集包含多个元素，那么赋值的时候，将对其中所有的元素赋值；取值的时候，则是只取出第一个元素的值（.text()例外，它取出所有元素的text内容）。