JQuery实战个人笔记
浏览器中ul和li元素默认情况下文字前都有圆点标识符，li元素会有缩进。Opera浏览器比较特殊，li的标识符和其他浏览器不同。list-style属性值为none时，可以清除ul和li前面的小圆点清除子菜单的缩进值，需要padding和margin都为0，其中IE6和IE7只有margin也为0的时候才可以清除缩进值可以使用bakcground-repeat来控制背景图的重复填充方式text-decoration属性值为none时，可以取消文字上的下划线float的值是left，可以使原本各自位于一行的元素全部在一行中向左浮动在一个包含了多个元素的JQuery对象上执行each方法，可以注册给each方法的那个function的内容被每一个元素执行。同时这个function还可以接收到一个参数，表示这个元素的索引值。JQuery中的很多方法也用到了eacheq方法可以根据索引值只得到JQuery对象中包含的多个元素中的某一个元素，并仍然返回元素对应的新JQuery对象addClass和removeClass方法用于添加和移除元素的class定义Javascript中的setTimeout方法可以延时执行某些代码，对应的clearTimeout可以清除设定的延时操作cursor属性可以控制元素上的鼠标样式，pointer的属性值表示手型样式，也就是我们常见的链接鼠标样式z-index可以控制元素在页面中的层高，值越大就会在页面的层越靠前，也就会覆盖住一些z-index值较低的元素。只有position的值为relative或absolute的元素，z-index才会生效JQuery中的load方法十分强大，可以把一个指定的静态，动态页面或服务器端程序输出的数据装入到执行load方法的JQuery对象包装着的元素中load方法还支持部分装载，在装入的页面地址后面加空格，然后使用选择器，就可以把页面中符合选择器的部分装入进来被load的页面一定要是UTF-8编码的，否则装入后中文会出现乱码。bind可以用于给指定的节点绑定Javascript的事件或JQuery中定义的事件。对于JQuery中没有直接提供注册方法的事件，可以用这种方式注册。方法的第二个参数可以是事件执行的方法定义。ajaxStart，ajaxStop对应ajax交互开始前和结束后的事件，给某一个节点注册了这两个事件后，当前页面的ajax交互开始前和结束后，就会执行指定的方法
<style type="text/css"> ul,li{padding:0px;margin:0px;list-style:none;}li{float:left;background-color:#606F6F;color:white;margin-right:2px;border:2px solid white;}div{clear:left;background-color:#6E6E6E;color:white;width:300px;height:100px;padding:10px;display:none;}div.contentTop{display:block;}.liIn{background-color:#6E6E6E;border:2px solid #6E6E6E}</style><script>$(document).ready(function(){$("li").each(function(index){//每个Li都会执行function方法//index为返回Li的索引值var timeOut="";$(this).mouseover(function(){var menuthis = $(this);timeOut = setTimeout(function(){//原来显示的区域隐藏$("div.contentTop").removeClass("contentTop");$("li.liIn").removeClass("liIn");$("div:eq("+index+")").addClass("contentTop");$(menuthis).addClass("liIn");},300);}).mouseout(function(){clearTimeout(timeOut);});});});</script> <ul ><li class="liIn">Menu1</li><li>Menu2</li><li>Menu3</li> </ul> <div class="contentTop">content1</div> <div >content2</div> <div >content3</div>