Jquery常用属性和方法

Jquery常用属性和方法

Jquery常用属性和方法

1.点我消失

1 $(document).ready(function(){2 $("p").click(function(){ // 只要点击p标签就会消失 亲自试一试3 $(this).hide();4 });5 });

2.隐藏和消失

$("#hide").click(function(){ $("p").hide(1000); //点击id为hide的标签，p标签内容1000毫秒消失 亲自试一试 }); $("#show").click(function(){ $("p").show(); });

3.点击消失再点击出现

1 $("button").click(function(){2 $("p").toggle(); 亲自试一试3 });

4.颜色渐变

1 $("#div1").fadeTo("slow",0.15); //后面值介于0~1之间 亲自试一试

5.向下滑和向上滑

$("#panel").slideToggle(); 亲自试一试

6.点击代码块就移动

$("div").animate({left:'250px'}); //代表向右移动250px 亲自试一试

1:juery获得内容三个方法 - text()、html() 以及 val()

感觉test（）和html（)没多大区别 val()是提取input里面内容的 亲自试一试

2：添加新内容的四个 jQuery 方法

• append() - 在被选元素的结尾插入内容

• prepend() - 在被选元素的开头插入内容

• after() - 在被选元素之后插入内容

• before() - 在被选元素之前插入内容

$("p").append(" <b>我在后面加粗补充</b>."); //prepend就是添加在前面$("ol").append("<li>在ol下新建一个列表项</li>"); 亲自试一试

1 $("img").after("上面是在同一元素之后"); 亲自试一试2 $("img").before("这里是不同元素");

3.删除元素/内容的两个方法

• remove() - 删除被选元素（及其子元素）

• empty() - 从被选元素中删除子元素

$("#div1").remove(); //他会删除div1块中所有元素，包括div1本身 亲自试一试

$("#div1").empty(); //他会删除div1块中所有元素，但不包括div1本身 亲自试一试

1 $("p").remove(".italic"); //删除p标签中，class为italic的标签 亲自试一试

4.jQuery 操作 CSS

$("p").css("background-color","yellow"); 亲自试一试$("p").css({"background-color":"yellow","font-size":"200%"});

5. jQuery操作尺寸

$("#div1").width(500).height(500); 亲自试一试