当前位置: 代码迷 >> Web前端 >> jquery小结(二)
  详细解决方案

jquery小结(二)

热度:66   发布时间:2012-10-10 13:58:11.0
jquery总结(二)

层次元素关系

?????1、祖先关系?? 空格符号

?????2、父子关系?? 大于符号

?????3、紧跟的关系? +符号

?????4、紧跟后的所有兄弟关系? ~符号

???CSS样式

?????1css("");带有一个参数是获取其属性的值

?????2css("","");为其对象设置一个指定的属性和属性值

?????3css(properties);把一个/值对对象设置为所有匹配元素的样式属性 {"":"","":""...};

案例:

<script type="text/javascript" src="./js/jquery-1.4.4.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	/**层级元素选择器的使用方式*/
    /**祖先关系 符号为===>空格*/
    //获取div元素的后代的所有input的元素 返回一个Jquery对象
    var $inputs=$("div input");
     /**输出Jquery对象的大小*/
    alert($inputs.size());
    /**父子关系 符号为===>>*/
    var $inp=$("form>input");
    var inpt=$inp[0]
    inpt.style.backgroundColor="red";
    alert("------中介线-------")
    /**采用Jquery对象本身的css方法来设置样式*/
    $inp.css("background-color","blue");
	/**匹配所有紧接在某个元素后的某个元素 符号为===> +*/
	var $lab=$("label+input");
	/**为其添加背景颜色*/
	$lab.css("background-color","green");
	/**匹配 prev 元素之后的所有 siblings(兄弟) 元素  符号为====> ~*/
	var $fpts=$("form~input");
	$fpts.css("background-color","yellow");
			 /**使用到了CSS样式
             .css("")//获取其样式属性的值
              案例: $fipts.css("background-color");
             .css("","") //为其添加样式属性及属性值
              $fipts.css("background-color","yellow");
             .css(Map);//把一个“名/值对”对象设置为所有匹配元素的样式属性。
              $fipts.css({"background-color":"red","color":"blue"});
             */
    alert("获取该Jquery对象的背景颜色值:"+$fpts.css("background-color"));
	
});
</script>

?

  相关解决方案