JQuery 笔记

简单的JQuery 功能

• 淡出：$("#div1").fadeOut();
          $("#div2").fadeOut("slow");
          $("#div3").fadeOut(3000);
• 隐藏：$(this).hide();
  • 　　隐藏父层：$(this).parents(".ex").hide("slow");
• 显隐切换：$(".panel").slideToggle("slow");
• 动画效果：$(".panel").animate({height:'300px',opacity:'0.4'},"slow");
                $(".panel").animate({width:'300px',opacity:'0.8'},6000);

HTML 操作

• 改变HTML元素中内容：$("p").html("W3School");
• 向HTML元素中追加内容：$("p").append(" <b>Appended text</b>.");
• 向HTML元素前后追加内容：$("img").before("<b>Before</b>");
                                     $("img").after("<i>After</i>");

CSS 操作

• 改变HTML元素的CSS属性：$("p").css("background-color","red"); //单个属性
                                      $("p").css({"background-color":"red","font-size":"200%"}); // 多个属性
• 获得元素的CSS属性：alert("Background color = " + $("p").css("background-color"));// 得到的颜色值为：rgb（255，0，0）的形式

通过load(url)来改变HTML内容：$('#myDiv').load("http://www.w3school.com.cn/jquery/jquery_examples.asp");