入口函数
$(document).ready()相对于window.onload的优势
1.执行时机
$(document).ready() //网页中所有的DOM结构绘制完毕后就执行,可能DOM元素关联的东西并没有加载完
window.onload //必须等待网页中所有的内容加载完毕后(包括图片)才能执行
2.编写个数
$(document).ready(function(){}) //可以同时编写多个,都执行
window.onload//只能编写一个,如果同时编写多个,只会执行最后一个
3.简写
$(document).ready(function(){})
简写:$(function(){})
window.onload//无简写方式
方法
1.end() 重新定位到上次操作的元素
2.fadeTo() 方法将被选元素的不透明度逐渐地改变为指定的值。
参数1:speed 速度 可选
参数2:opacity 透明度 必选
$("#btn1").click(function () {
$("div").fadeTo(100,0.3)
});
3.unbind() 方法移除被选元素的事件处理程序。
4.is() 根据选择器、元素或 jQuery 对象来检测匹配元素集合，如果这些元素中至少有一个元素匹配给定的参数，则返回 true。
5.appendTo() 方法在被选元素的结尾（仍然在内部）插入指定内容。
提示：append()和 appendTo() 方法执行的任务相同。不同之处在于：内容和选择器的位置，以及 append() 能够使用函数来附加内容。
语法: $(content).appendTo(selector)
content 必需。规定要插入的内容（可包含 HTML 标签）。
selector 必需。规定把内容追加到哪个元素上。
6.children() 获取子元素 只考虑子元素不考虑任何后代元素
7.next() 取得匹配元素后面紧邻的一个兄弟元素
8.prev() 取得匹配元素前面紧邻的一个兄弟元素
9.sibling 取得匹配元素的所有兄弟元素
10.find()方法获得当前元素集合中每个元素的后代，通过选择器、jQuery 对象或元素来筛选。
11.finder()对自身集合进行遍历,筛选 find()是对后代元素操作
12.scrollTop()和scrollLeft() 分别获取元素的滚动条距顶端的距离和距左侧的距离
// var scrollTop = $("p").scrollTop();//获取元素的滚动条距顶端的距离
// var scrollLeft = $("p").scrollLeft();//获取元素的滚动条距左侧的距离
13.offset() 获取元素在当前视窗的相对便宜,其中返回的对象包含两个属性,即top和left.只对可见元素有效
var offset = $("p").offset();//获取<p>元素的offset()
var left = offset.left //获取左偏移
var top = offset.top //获取上便宜
jQuery对象和DOM对象相互转换
1.jQuery对象转DOM对象
jQuery提供两种方法将jQuery对象转换成DOM对象
即[index]和get(index)
注意:jQuery对象是一个数组对象(对象集合)
var $cr = $("#cr"); //jQuery对象
var cr = $cr[0]; //DOM对象
var br = $cr.get(1) //DOM对象
2.DOM对象转jQuery对象
只需要用$()把DOM对象包装起来就可以获得一个jQuery对象
var cr = document.getElementById("cr");//DOM对象
var $cr = $(cr); //jQuery对象
注意 :DOM对象才能使用DOM中的方法,jQuery不可以使用DOM中的方法
选择器
+
$("prev+next") //选择的是prev后的一个兄弟元素
$(".one+div") //选择class为one元素的下一个div元素
~
$("prev~sibling") //选择的是prev后面的所有Sibling元素
$(".two+div") //选择class为two元素的后面的所有的div元素
选择器中含有空格的注意事项
1.
var $t_a = $(".test :hidden");
//带空格 在class属性是test的元素中 选取其子元素是hidden类型的
以上代码是选取class为"text"的元素里面的隐藏元素
2.
var $t_a = $(".test:hidden");//不带空格的
以上代码选取隐藏的class为"test"的元素.
结果不同原因:后代选择器与过滤选择器的不同
对于过滤选择器加上空格来说,它获取的事其子元素的过滤,所以代码1获取的事class为test的元素的子元素的隐藏元素
代码2没有空格,它获取的事其自身元素的过滤,所以代码2获取的class为test的隐藏元素
网友评论