认识jQuery

 JQuery是继 prototype之后又一个优秀的 Javascript库。它是轻量级的js库 ,它兼容 CSS3,还兼容各种浏览器( IE 6.0+,  FF1.5+,  Safari 2.0+,  Opera 9.0+),jQuery2.0及后续版本将不再支持IE6/7/8浏览器。jQuery使用户能更方便地处理 HTML标准通用标记语言下的一个应用)、events、实现动画效果,并且方便地为网站提供 AJAX交互。jQuery还有一个比较大的优势是,它的文档说明很全,而且各种应用也说得很详细,同时还有许多成熟的 插件可供选择。jQuery能够使用户的html页面保持代码和html内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需要定义id即可。
jQuery是一个兼容多浏览器的 javascript库,核心理念是write less,do more(写得更少,做得更多)。jQuery在2006年1月由美国人 John Resig在纽约的 barcamp发布,吸引了来自世界各地的众多JavaScript高手加入,由Dave Methvin率领团队进行开发。如今,jQuery已经成为最流行的javascript库,在世界前10000个访问最多的网站中,有超过55%在使用jQuery。
jQuery是免费、开源的,使用 MIT许可协议。jQuery的语法设计可以使开发更加便捷,例如操作 文档对象、选择 DOM元素、制作动画效果、事件处理、使用 Ajax以及其他功能。除此以外,jQuery提供API让开发者编写插件。其模块化的使用方式使开发者可以很轻松的开发出功能强大的静态或动态网页。
jQuery,顾名思义,也就是JavaScript和查询(Query),即是辅助JavaScript开发的库。

1jquery是一个可实习快速卡发、简洁轻量级的JavaScript库,可以用最精简的程序跨HtmlDom操作。

 

2、关于引用js库文件:需要在网页中应用jquery.js文件,一般为<scripttype="text/javascript"src=jquery-1.6.2.min.js"></script>

 

3CDN全称是ContentDelivery NetWork ,即内容分发网络。为尽可能的避开互联网上有可能影响数据传输速度和稳定瓶颈的环节,是内容传输更快跟稳定。一些网络公司存在jquery的副本,作为jquery库的CDN,像是goole<script

Type="text/javascriptsrc=http://ajaxGoogleapis.com/ajax/libs/jquerys/l1.6.2/jquery.min.js">

 

4、第一个jquery例子:

$(document).ready(function(){

 

});

可以简写为$(function(){});

是当HTMLDom全部页面加载完毕后在执行内部相应的方法;

 

联想:JS中实现相同方式的还有window.οnlοad=funtion(){}

区别:window.onload必须等待网页中所有的内容加载完毕后包括图片才能执行。不可以编写多个window.οnlοad=function(){},$(document).ready()是在所有的Dom结构绘制完毕后执行可能Dom元素关联的东西并没有加载完成。

 

jquery使用的选择器,用来选择HTML元素,其中document为整个HTML文档。$符号为jquery这个JavaScript类,

 

5、解决jquery冲突(重新定义$符号):

如果在其他Js库文件中同样使用了$符号,则会与jquery发生冲突,为了解决此问题Jquery定义了静态方法noConflict(),

$.noConflict()用来删除$变量,然后就可以使用其他库中的$了,如果继续使用jquery的话可以var jjj=$.noConflict();就可以继续使用jjj作为$的替代来继续写代码了。

 

 6jquery很方便但是也有其不可以取代js的部分,例如jqeury尽可以处理元素节点,属性几点和文本节点,对于其他类型的节点,必须使用Core DomHTML Dom方法来直接处理。jquery虽然可以处理CSS样式但是不能处理style元素定义的样式表,也不能处理引入的外部样式表。


添加:

1

<pre name="code" class="javascript">$(".has_children").click(function(){
$(this).addClass("higthlight)
.clildren("a").show().end()
.siblings().removeClass("highlight")
.children("a").hide();
}


 

这段代码的作用是当鼠标点击到class中含有has_children的元素的是有给其添加一个名为highlightclass,人后将其内部的<a>元素全部显示出来,并且被单击的class中含有has_children元素元素同辈元素都去掉一个名为hightlightclass,同时同辈元素内部的<a>元素全部隐藏。

 

2、在编写jquery对一个对象操作的情况下,建议不超过三个操作写在同一行中,如果是对一个对象进行多个操作,则要分行处理。

 

3jquery对象和Dom对象,DOMDocument Object Model,文档对象模型)。

jquery对象是通过包装Dom对象后产生的对象。

$("#foo").html();等同于jsdocument.getElementById("foo").innerHTML;

 

jqueryDom的相互转换:如果获取的对象是jquery对象在变量前面加$,例如:var $variable = jQuery对象;如果要获取DOM对象则定义为var variable = DOM对象;

 

4jquery对象转换成Dom对象:

1jquery是一个数组对象,可以通过【index】的方法得到相应的dom对象。则是var $cr =$("#cr"); var cr= $cr[0];

crDOM对象;

2)也可以通过getindex)的方法得到相应的DoM对象。var $cr =$("#cr"); var cr= $cr.get(0);\

 

5Dom对象转换成jquery对象。使用$符号包裹起来就得到了一个jquery对象。例如var cr=document.getElementById("cr");var $cr =$(cr);

 

6、解决jquery和其他库的冲突:

jquery库文件在其他库导入之前导入:Var $jquery = jQuery.noConflict();就可以使用$jquery代替$符号了。

jquery库文件在其他库导入之后导入:可以直接使用$了;


  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值