jQuery是目前使用最广泛、寿命最长的JavaScript函数库。我们可以通过jQuery进行元素的获取、创建、移动、属性的修改以及链式操作。
获取元素
$(document) //选择整个文档对象
$('#id1') //选择id名为id1的元素
$('div.red') //选择class为red的div元素
$('a:first') //选择网页中第一个a元素
$('tr:odd') //选择表格的奇数行
$('#myForm:input') //选择表单中的input元素
jQuery的基本思想就是选择某个网页的元素后,返回的不是元素本身,而是元素对象。然后对其进行其他操作。
链式操作
$('#test').find('.child').addClass('red').end().addClass('green')
分解:
$('#test') //找到id为test元素
.find('.child') //选择其中的child元素
.addClass('red') //给这个元素的添加class=red
.end() //退回这个节点,返回到第一步
.addClass('green') //test元素添加class=green创建元素
$('<p>hello</p>')
$('<div class='new'> hello </div>')移动元素
//div元素移动到p元素的后面
$('div').insertAfter($('p'));
//p元素移动到div元素的前面
$('p').after($('div'));修改元素属性
使用同样一个函数,传的参数不同,函数实现的功能也会不一样。这个叫做重载
$('h1').html() //无参数,直接读h1的值
$('h1').html('hello') //将hello放入到h1中