JQ/链式编程/JQ动画

<input type="button" name="" id="btn">
<div id="dv"></div>

<script type="text/javascript">
	$("#btn").click(function() {
		$("#dv").css({"width":"200px","height":"300px","background-color":"red"});
	});
</script>
window.onload = function() {}
jq中:
$(window).load(function () {});

$(document).ready(function () {});  加载速度快,只要页面元素加载完便执行
jQuery(function () {});和上面一样
$(function () {});和上边一样
Jquery和Dom互转
D->J
将Dom对象使用$()包裹起来成为Jquery对象
$(btnObj).click(function(){ $(this).css("backgroundColor","red"); });
J->D
$(btnObj).get(0)
$(btnObj)[0]
.val() 获取value的值  如果val()里面写内容了表明赋值;
JQuery中的选择器:
$("#id") $(".class") $("tagname") $("*")全部
.text(); 相当于DOM中的innerText或者textContent
$("#dv").text("");
.css();设置样式
标签+类选择器(交集选择器)
$(li.cls)
多条件选择器:并集选择器
$(,,,)
层次选择器
$("div p")
$("div>p")
索引选择器:
$("#uu>li:eq(4)")获取uu下的li中的索引是4的li元素
$("#uu>li:gt(4)")大于4
$("#uu>li:lt(4)")小于4
奇数偶数选择器
:even偶数
:odd奇数
$(this).siblings("li")  找当前元素的兄弟li
$(this).find("li") 找当前元素下面的全部li
$(this).index()  获取当前索引
$("div>img").last("img")找到最后一个img
添加和删除样式
dom中element.className = ....
类样式
$("#div").addClass("cls");  里边没有.
$("#div").addClass("cls1 cls2");
移除类样式
$("#div").removeClass("cls");
移除全部.removeClass();
判断是否应用了类样式
.hasClass("");
链式编程:
obj.html().css().方法().方法()  调用完之后返回的应该是当前对象才行。
获取兄弟元素的方法:
.next()当前元素的下一个兄弟元素   相当于element.nextElementSibling
.nextAll()当前元素之后的所有兄弟元素
.prev()当前元素的前一个兄弟元素   相当于element.previousElementSibling
.prevAll()当前元素之前所有兄弟元素
.siblings()当前元素所有兄弟元素
动画  hide()   show()
hide方法中可以写参数,一个是数字类型,一个是字符串类型
1数字类型,1000表示毫秒
2字符串类型,“slow”“normal”“fast”
hide(,function() { })  执行隐藏之后执行的函数
$(this).prev().hide(800,arguments.callee)递归
其他动画方法:
$("#div").slideUp(1000);//滑入
$("#div").slideDown(1000);//滑出
$("#div").slideToggle(1000);//切换滑入滑出

$("#div").fadeIn(1000);//淡入
$("#div").fadeOut(1000);//淡出
$("#div").fadeToggle(1000);//切换淡入淡出

$("div").fadeTo(1000,0.3);  //经历的事件,到达的透明度
$("div").fadeTo(0,0.1) //与css("opacity","0.1");一样
animate方法:
animate({"key":"value",....},{},function(){})
第一个参数:键值对
第二个参数:毫秒
第三个参数:回调函数
stop方法:停止动画
.stop().show()

发表评论

邮箱地址不会被公开。 必填项已用*标注