jquery琐碎事

映像里jquery的选择器用了很多次了,每次都是用几遍 感觉很熟悉了,很长时间不用就又忘了,然后再用的时候有得用试错法或者查文档,以后要养成写文档笔记的习惯,这样可以加深自己的映像。

1.jquery选择器 

jQuery(document).ready(function(){
var aa=jQuery("#mod_2242>div").eq(1).css("margin-top","330px");
console.log(aa);
});

jQuery("#mod_2242>div")  "#mod_2242>div"表示id=mod_2242下的所有div标签的子节点,在实际使用中发现此种写法和"#mod_2242 div"效果相同

 

css("margin-top","330px")  //设置元素css样式的margin-top属性,还有一种写法css({margin-top:"330px"})  但这种写法书写margin-top属性时会报错,很诧异!

 

2.jquery图片轮转的一段代码,很简单。

 

<script language="javascript">
var len=4;
var st=0;
jQuery(document).ready(function(){
setInterval("showAuto()",2000);
jQuery("#imageTurn ul li").click(
function(){
var current_index=$(this).index();
jQuery("#imageTurn dl").each(
function(){
jQuery(this).removeClass("show");
}
);
jQuery("#imageTurn dl").eq(current_index).addClass("show");
jQuery("#imageTurn ul li").each(function(){jQuery(this).removeClass("nub")});
jQuery("#imageTurn ul li").eq(current_index).addClass("nub");
}
);
//jQuery(".Bimg").hover(function(){clearInterval("showAuto()");},function(){setInterval("showAuto()",2000);});
});
function showAuto(){
if(st>3){
st=0;
}else{
st++;
}
jQuery("#imageTurn ul li").eq(st).trigger("click");
}
</script> 

 

 

3.jquery 获取元素的高度

 

  
获取浏览器显示区域的高度 :   
$(window).height();   
获取浏览器显示区域的宽度 :  
  
$(window).width();   
获取页面的文档高度 :  
$(document).height();   
获取页面的文档宽度 :$(document).width();  
  
获取滚动条到顶部的垂直高度 :  
  
$(document).scrollTop();   
获取滚动条到左边的垂直宽度 :  

 

4.使用jquery循环显隐菜单的常用代码段:

 

jQuery(".showmore_title").click(function(){

 

var status=jQuery("#tool_list").css("display");//获取对应元素下css属性的值
if(status=="none"){
jQuery("#sider_bar_nav").css({"position":"fixed"});
jQuery(".showmore_title").css("background-image","url(./yii/css/image/wind/Tip_up.jpg)");
jQuery("#tool_list").show();
}else{
jQuery("#sider_bar_nav").css({"position":""});
jQuery(".showmore_title").css("background-image","url(./yii/css/image/wind/Tip_down.jpg)");
jQuery("#tool_list").hide();
}
})

 

 

 

目前为止,还是把jquery当作工具,能完成工作就ok了,对其中的一些细节基本上是不求甚解,先这样吧。 

 

 

posted @ 2013-09-12 13:35  刘水香  阅读(170)  评论(0编辑  收藏  举报