2015年8月31日

jQuery样式

    var myjq=$.noConflict();

可以为美元符号$重新定义一个命名。

    jQ操作css()的方法实例：
     第一种 
    $("div").css("width","100px");
    $("div").css("height","100px");
    $("div").css("background","#FF0000");

     第二种
    $("div").css({
        width:"100px",
        height:"100px",
        backgroundColor:"#0f0"s


    //addClass()方法实例：
    $("div").addClass("style1");

    //去除效果
    $("dic").removeClass("style1");

    //toggle()是来回切换
    $("dic").toggleClass("style1");

    $("obj").height();//返回盒子模型的content.height；
    $("obj").innerHeight();//heigt+padding;
    $("obj").outHeight();height+padding+boeder;
    $("obj").outHeight(true);height+padding+boeder+maigin;

元素遍历

向下遍历

$("#div1").children("a").css({border:"5px solid#FF00FF"});

遍历div1的子元素,加参数"a"表示是作用子元素a，只遍历一代。

向上遍历

$("#div1").find("a").css({border:"5px solid #FF00FF"});

寻找#div1后代元素，find()必须要参数。

$("a").parent().css({border:"5px solid #0f0"});//父元素，只能一层。
$("a").parents().css({border:"5px solid #0f0"});//所有祖先元素，
$("a").parentsUntil("#div1").css({border:"5px solid #0f0"});//区间之间的元素

同级遍历

$("h4").siblings().css({border:"3px solid red"});
//所有同级元素修改。

$("h4").next().css({border:"3px solid red"});
//下一个元素修改。

$("h4").nextAll().css({border:"3px solid red"});
//下面所有元素修改。

$("h4").nextUntil("h6").css({border:"3px solid red"})
//下面的元素的区间修改。

prev() 、preAll() 、preUntil()同上。

元素过滤

$("div p").first().css("background-color","red");
//选择第一个。

$("div p").last().css("background-color","red");
//选择最后一个。

$("div p").eq(n).css("background-color","red");
//选择符合的第n个。

$("div p").filter(".pclass").css("background-color","red");
//选择符合要求而且类名是`.pclass`的元素。

$("div p").not(".pclass").css("background-color","red");
//除去符合要求而且类名是`.pclass`的元素。