JQery是对javascript的封转库
也就是调用JQuery的一句函数JQuery
JQuery的扩展插件非常多
JQuery的优点:尺寸小、使用简便、链式编程、隐式迭代(自动对于多个元素进行迭代方法调用)、屏蔽游览器差异跨浏览器兼容性好、插件丰富、开源、免费
vsdoc是vs2008sp1以后增加的一个技术,将js技术未见对应的vsdoc(相当于一个js库提供的数据库)放到js
一起,就会有这个第三方js的自动提示的功能
onload只能注册一次,后注册的取代前注册的,而
ready则可以多次注册都会被执行
$(document).ready(function (){alert("你好!")})
ready简写方式
$(function(){alert("你好")});
ready则是dom元素创建完毕被触发,这样可以提高网页的响应速度
早jquery中可以使用$(window).load那种事件调用的时机
$其实是一个函数
jquery提供的函数:
$.map(array,fn)对数组array中每一个元素调用fn函数逐个进行处理,fn函数将处理返回,最后得到一个新数组
例如:
var array = [3, 5, 8];
var array2 = $.map(array, function (item) {
return item * 2;
})
$.
$.map不能处理Dictionary风格的数组
$.each(array,fn)对数组array每个元素进行遍历,相当于dom中屈指的for循环
$.each(arr, function () {
alert(this);//表示当前遍历到的value,dictionary也一样
})
普通数组用以上表达式
****jquery对象、dom对象
jquery对象就是通过jquery包装dom对象后产生的对象
alert($(div1).html());//取到div1中innerHTML的值
jquery对象只能调用jquery对象封装的方法,不能调用dom对象的方法,dom对象也不能调用jquery对象的方法,所以alert($(div1).innerHTML)是错的,因为innerHtml是dom对象的属性
array是js语言本身的对象,不是dom对象,因此不需要转换为jquery对象才能用
将dom转换为dom对象,$(dom对象);当调用jquery没有封装的方法的时候必须用dom对象,转换方法:
var domobj=jqobj[0] 或者var domobj=iqobj.get(0)
jquery修改样式:$("#div1").css("background","red");
获得样式$("#div1").css("background");
$("#div1").val(new date())赋值//有参数就是赋值
$("#div1").val()取值
$("#div1").html("")赋值//相当于dom中的innerHTML
$("#div1").html()取值
$("#div1").text("")赋值//相当于dom中的innerText
$("#div1").text()取值
****jquery选择器
jquery选择器用于查找满足条件的元素,比如可以用
$("#控件id")来根据控件id获得控件的jquery对象
可以根据控件的类名称,比如$("div").click()
css选择器
<style type="text/css">
.test{background-color:red;}
</style>
$(".test").css("background", "blue");
多条件选择器:$("p,div,span.test"),同时选择p标签、div标签和拥有test样式的span标签的元素
注意选择器表达式中的空格不能多不能少
层次选择器
$("div li")获取div下的所有li元素(后代、子代、子的子)
$("div > li")获取div下的直接li子元素
$(".test + div")获取样式名为test之后的第一个div元素(不常用)
$(".test ~ div")获取样式名为test之后的所有div元素(不常用)
***jquery的迭代
就算写错id名称也不会报错
可以用以下方式判断:
if($("div1".length<=0))
{
alert("该控件没有找到!");
}
****节点遍历;
next()方法用于获取节点之后的挨着的第一个同辈元素
nextAll()方法用于获取节点之后的方法用于获取所有元素nextAll("div")可以过滤
siblings方法用于获取所有同辈元素
*****链式编程
jquery是javascript的一个库,所以基本都为方法,所以可以一直点下去,
******基本过滤选择器
:first选取第一个元素。$("div:first")选取第一个div
:last选取第一个元素。$("div:last")选取最后一个div
:not(选择器)选取不满足“选择器”条件的元素i
$("input:not(.test)")选取样式名不是test的<input>
:even、:odd 选取索引是奇数、偶然的元素:
$("input:even")选取索引是奇数的<input>
(多用于隔行变色)
:eq(索引序号)、:gt(索引序号)、:lt(索引序号)选取索引序号等于、大于、小于索引序号的元素,比如$("input:lt(5)")选取索引小于5的input
***相对选择
只要在$()指定第二个参数,第二个参数为相对的元素。
$("ul", $(this).css("background", "red"));