JQ初学总结一

发布时间:2019-02-11 发布网站:脚本之家
脚本之家收集整理的这篇文章主要介绍了JQ初学总结一脚本之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

Jquery是最火的JavaScript库,大部分web开发都会用到就jquery,而作为初学者看了一些jq的用法总结自己的学习以增强自己的认知。

普通的javascript的缺点是:每种控件的操作方式可能不统一,不同浏览器下也会有区别。用javasript编写跨浏览器的程序非常麻烦。而是用jquery可以很好的做到兼容大多数浏览器:ie、firefox、谷歌。

但别认为jq是一种新的语法,因为JQuery就是JavaScript语法写的一些函数类,内部仍然是调用JavaScript实现的,所以并不是代替JavaScript的。使用JQuery的代码、编写JQuery的扩展插件等仍然需要JavaScript的技术,Jquery本身就是一堆JavaScript函数。要知道用JQ能实现的我们也可以自己编写javascript+dom实现,只是jq帮我们封装了一堆函数,使用者直接调用要实现的函数即可;

 JQuery的优点:尺寸小、使用简单方便(Write Less,Do More,吃得少干得多。链式编程($("#div1").draggble().show().hide().fly())、隐式迭代(自动对于多个元素进行迭代方法调用))、屏蔽浏览器差异跨浏览器兼容性好(IE 6.0+,FF 2+,Safari 3.0+,Opera 9.0+,Chrome)、插件丰富、开源、免费。

下面说说jq的简单使用:

一、页面元素加载完毕事件:

$(document).ready(function() {

    alert("加载完毕!");
});//注册事件的函数,和普通的dom不一样,不需要在元素上标记on**这样的事件。
也可以简写为$(functions(){ alert("加载完毕!");});
在dom树中有一个onload事件也是实现页面加载完后执行。
但两者又有区别:1)、onload只能注册一次。(window.onload=function(){....})后注册的会取代先注册的函数。而ready可以多次注册都会被执行;
                       2)、onload是在所有dom元素创建完毕、图片、css等都加载完毕后才会被触发。JQ ready却是在dom元素创建完毕后就触发。ready的方式可以提高页面的响应速度;在JQ中也可以用$(window).load(function(){....});来实现dom 的onload那种事件调用的时机。(*在JQ中采用$(domObj)方式把dom对象转化为JQ对象load是JQ自己的内部的函数)
 
二、选择器
1、基本选择器
JQuery选择器用于查找满足条件的元素,比如可以用$("#Id")来根据控件id获得控件的jQuery对象,相当于dom中的getElementById;
$("TagName")来获取所有指定标签名的jQuery对象,相当于getElementsByTagName;
  多条件选择器:$("p,div,span.menuitem"),同时选择p标签、div标签和拥有menuitem样式的span标签元素(类似于CSS选择器);
l层次选择器:
li")获取div下的直接li子元素;
2、过滤选择器
:first 选取第一个元素。$("div:first")选取第一个
$(".warn:first");
:last 选取最后一个元素。$("div:last")选取最后一个
:not(选择器) 选取不满足“选择器”条件的元素,$("input:not(.myClass)")选取样式名不是myClass的
:even、:odd,选取索引是奇数、偶数的元素:$("input:even")选取索引是奇数的(可以做表格奇偶行的背景不同)
:eq(索引序号)、:gt(索引序号)、:lt(索引序号) 选取索引等于、大于、小于索引序号的元素,比如$("input:lt(5)")选取索引小于5的
:header选取所有的h1……h6元素
:animated正在执行动画的元素。
组合选择器是按照表达式从前向后进行数据过滤
3、属性过滤选择器:
,JQuery中没有对getElementsByName进行封装,用$(“input[name=abc]”)。
还可以选择开头、结束、包含等,条件还可以复合。
用$(":radio[name=groupName]")可以获得同一组的radiobutton 然后在可以进行操作。
4、表单对象选择器(过滤器):
$(“:input”)选取所有