jquery的相关用法

选择器
基本选择器
1.id选择器
$('#id1')找到id为id1 的标签
2.class选择器
$('.class1')找到class中有class1这个类的标签
3.标签选择器
$('tag') 找到tag标签
4.标签+class
$('div.class1') 找到class中有class1这个类的div标签
5.组合选择器
$("#id, .className, tagName")

基本筛选器 对选择的标签进行条件筛选
$('div:first')
$('div:last')
$('div:odd')
$('div:even')
$('div:eq(index)')
$('div:gt(index)')
$('div:lt(index)')
$('li:not(:基本筛选器元素)') $('li:not(:eq(2))')
$('li:not("基本选择器元素")') $('li:not("#l2")')

$('div:has("标签名")') $('li:has(div)')
属性选择器:基于属性进行选择
$('[attribute]')
$('[attribute=value]')
$('[attribute!=value]')
表单选择器 针对input/select
$(':text')
$(':password')
$(':submit')
$(':radio')
$(':checkbox')

选择器方法
$('').next()
$('').nextAll()
$('').nextUntil("标签/id")

$("#id").prev()
$("#id").prevAll()
$("#id").prevUntil("#i2")

$("#id").parent()
$("#id").parents()
$("#id").parentsUntil('body')

$("#id").children();
$("#id").siblings();

$('').find()
$('').filter()

标签操作
样式操作
class操作
对象.addClass('c1')
对象.removeClass('c1')
对象.hasClass('c1')
对象.toggleClass('c1')

css()
对象.css('color','red')
对象.css({'color':'red','font-size':'100px'})

位置操作 相对body标签
offset() 相对于最上和最左边的距离 offset({top:200,left:200})
position() 相对于父级标签(设置了position:relative或absolute)

$(window).scrollTop()

绑定滚动事件
$(window).scroll(function(){})
绑定click事件
对象.click(function(){})


尺寸
对象.height() content的高度
innerHeight() content的高度 + padding的高度
outerHeight() content的高度 + padding的高度 + border高度

文本操作
text('值')
html('值')
值得操作
对象.val() 多选checked的坑:1.for循环来取值 2.$('input:checked')
对象.val([1,2])
对象.val('2')
对象.val('文本')

值操作

<input type="radio" name="one" value="1">A
<input type="radio" name="one" value="2">B
<hr>
<input type="checkbox" name="hobby" value="1">a
<input type="checkbox" name="hobby" value="2">b
<input type="checkbox" name="hobby" value="3">c
<input type="checkbox" name="hobby" value="4">d
<hr>
<select name="city" id="">
    <option value="1">Beijing</option>
    <option value="2">Shanghai</option>
    <option value="3">Guangzhou</option>
    <option value="4">Shenzhen</option>
    <option value="5">Hangzhou</option>
</select>
<hr>
<select multiple name="Province" id="">
    <option value="1">Hebei</option>
    <option value="2">Henan</option>
    <option value="3">Hubei</option>
    <option value="4">Hunan</option>
    <option value="5">Sichuan</option>
</select>

　　

1.radio

获取值:$(':radio:checked').val()

赋值:$(':radio').val([2])

2.checkbox

获取值:$(':checkbox:checked').val()

赋值:$(':checkbox').val([1,2])

3.select

获取值:$("[name=city]").val()

赋值:$("[name=city]").val(3)

4.select multiple

获取值:$("[name=Province]").val()

赋值:$("[name=Province]").val([1,4])