jq的复习

HTML 元素选取

1 获得内容 - text()、html() 以及 val()
2 三个简单实用的用于 DOM 操作的 jQuery 方法：
3 
4 text() - 设置或返回所选元素的文本内容
5 html() - 设置或返回所选元素的内容（包括 HTML 标记）
6 val() - 设置或返回表单字段的值   //input

$("#btn1").click(function(){
alert("Text: " + $("#test").text());
});
$("#btn2").click(function(){
alert("HTML: " + $("#test").html());
});

HTML 元素操作 jQuery attr() 方法用于获取属性值。

 1 $(document).ready(function(){
 2   $("#btn1").click(function(){
 3     $("#test1").text("Hello world!");
 4   });
 5   $("#btn2").click(function(){
 6     $("#test2").html("<b>Hello world!</b>");
 7   });
 8   $("#btn3").click(function(){
 9     $("#test3").val("Dolly Duck");
10   });

我们将学习用于添加新内容的四个 jQuery 方法：

append() - 在被选元素的结尾插入内容
prepend() - 在被选元素的开头插入内容
after() - 在被选元素之后插入内容
before() - 在被选元素之前插入内容

function appendText()
{
var txt1="<p>Text.</p>";              // 以 HTML 创建新元素
var txt2=$("<p></p>").text("Text.");  // 以 jQuery 创建新元素
var txt3=document.createElement("p");
txt3.innerHTML="Text.";               // 通过 DOM 来创建文本
$("body").append(txt1,txt2,txt3);        // 追加新元素
}
// after & before
 $("#btn1").click(function(){
    $("img").before("<b>Before</b>");
  });

  $("#btn2").click(function(){
    $("img").after("<i>After</i>");
  });

CSS 操作
HTML 事件函数

 $("button").bind({
    click:function(){$("p").slideToggle();},
    mouseover:function(){$("body").css("background-color","red");},  
    mouseout:function(){$("body").css("background-color","#FFFFFF");}  
  });

JavaScript 特效和动画

 1 jQuery 拥有下面四种 fade 方法：
 2 
 3 fadeIn()  
 4 fadeOut()
 5 fadeToggle()
 6 fadeTo()  多了一个透明度
 7 $("button").click(function(){
 8   $("#div1").fadeIn();
 9   $("#div2").fadeIn("slow");
10   $("#div3").fadeIn(3000);
11 });

1 jQuery 拥有以下滑动方法：
2 
3 slideDown()
4 slideUp()
5 slideToggle()
6 
7 $("#flip").click(function(){
8   $("#panel").slideToggle();
9 });

1 $(document).ready(function(){
2   $("button").click(function(){
3     var div=$("div");  
4     div.animate({left:'100px'},2000);
5     div.animate({fontSize:'3em'},"slow");

jQuery 动画：

6  });
 7 });

HTML DOM 遍历和修改
AJAX
Utilities