码农成长记——jqurey之同胞关系

2017年1月12日

css();  函数,获取对象css属性值eg: $(".menu").css("display")

attr(); 函数，获取对象里面的html属性

prop(); 1.8版本以前不能用

$("#link").attr("href") //获取id为link的a标签的href的值

$("input").attr("value")//获取表单元素的value值 相当于$("input").val();

$(".menu").attr('href',"www.baidu.com")//获取并赋值

$("#link").prop({'href':'','target':''});//获取多个属性并赋值

jquery中的事件  都把前面的on去掉

//点击事件

$(".bt").click(function(){

    函数执行语句

}); 点击事件并触发函数

谁控制谁就是标准eg全选 被控制的对象参照主控的checked属性

bt.val();  获取表单元素的value值

bt.val("值");  给表单元素重新赋值

css里面类的增加删除

addClass('');  添加类

removeClass(''); 中间的c要大写

toggleClass(''); 交替添加删除类  toggle开关  切换的意思

aa($(this)); 传对象$(this)指代当前对象

----------------------------------------

同胞元素关系

next() 相连的下一个元素，中间没有其他的元素  返回一个对象

prev() 相连的上一个元素，中间没有其他的元素 返回一个对象

siblings() 除自己以外所有的同胞  返回一个对象集

    $(this).addClass('bg').siblings().removeClass('bg');

    $(".menu *").removeClass('bg'); //对整体操作相当for循环遍历

nextAll()  下面所有的同胞

nextUntil  返回介于两个给定参数之间所有的同胞（不包括临界点）

prevAll()

preUntil()

index()  函数,获取当前对象在对象集中的下标值

$(this).index();  

$(this).index('span'); 只获取span元素的下标值

一个大的对象集下还可以按类别分出小的对象集

show();  函数，显示当前元素

hide();  隐藏当前元素

toggle(); 交替显示隐藏

---------------------------------------------

父子关系

parent(); 直接的父关系 返回一个对象

children(); 直接的子关系 返回一个对象

parents(); 可以是间接父关系，括号里面要加限定条件

find(); 可以是间接子关系

$(this).next().siblings('ul').hide();

当前元素下一个对象所有其他为ul的同胞元素隐藏

$(this).next().toggle();

当前元素下一个元素对象交替显示隐藏

//$(this).siblings('ul').hide();  每次this下面的ul被hide()了

//$(this).next().toggle();  这里再toggle()就没有意义了

需要将this元素下一个ul排除

所以  $(this).next.siblings('ul').hide();

如果通过jquery获取的对象只能用jquery的方法

input[type=text]{....}

css 限定input的类型为text的css