Jquery的简介及由来

时间:2022-04-11 18:47:07

Jquery的简介

jQuery由美国人John Resig在2006年初创建,是继prototype之后又一个优秀的javaScript框架。•jQuery是一个快速的,简洁的javaScript库,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。 程序员:简化javascript和ajax编程,能够使程序员从设计和书写繁杂的JS应用中解脱出来,将关注点转向功能需求而非实现细节上,从而提高项目的开发速度。•• 用户:改善了页面视觉效果,增强了与页面的交互性,体验更绚丽的网页物资。•jQuery 是继 Prototype 之后又一个优秀的 JavaScript 库•jQuery 理念: 写得少, 做得多. 优势如下:–轻量级–强大的选择器–出色的 DOM 操作的封装–可靠的事件处理机制–完善的 Ajax–出色的浏览器兼容性–链式操作方式–等•轻量级:     经GZip压缩后传输的代码文件仅29KB,未经压缩传送的代码文件仅120KB•链式语法 :     $("p.surprise").addClass("ohmy").show("slow");••CSS1-3选择器:支持CSS选择器选定DOM对象•跨浏览器:支持IE 6.0+、Opera 9.0+、Firefox 1.5+、Safari 2+•  简单:  jQuery文档说明很全,各种应用说明也很详 细,同时还有很多成熟的插件可供选择• 易扩展: jQuery能够使用户的html页保持代码和html 内容分离,也就是说,不用再在html里面插入一堆js来调用命令了,只需定义id即可JQuery的特点:屏蔽浏览器差异,对DOM的操作提供了方便的扩展,易用的事件处理API和动画API。强大的插件机制。社区活跃,文档非常齐全,全部配有示例。学习容易,易用性很高。

Jquery是继prototype之后又一个优秀的Javascrīpt框架。它是轻量级的js(压缩后只有21k) ,兼容各种浏览器 (IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+)。jQuery使用户能更方便地处理HTML documentsevents、实现动画效果,并且方便地为网站提供

当DOM载入就绪可以查询操纵时绑定一个要执行的函数

Jquery的基本编辑器

1)#id

  根据指定的id匹配一个元素

  如果选择器中包含特殊字符,可以用两个斜杠转义

 用法:$("#idname");

2)、element

   根据元素名匹配所有的元素

   一个用于搜索的元素,指向DOM节点的标签名

  用法:$("元素标签名称")

3).class

   根据给定的类名匹配元素

   一个用于搜索的类。一个元素可以有多个类,只要有一个符合条件的就能匹配到。

用法:$(".类名")

4)、*

匹配所有的元素

找到每一个元素

用法:$("*")  

 Jquery的第一个小实例

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head>

<title>jquerydom的相互转化</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<script language="javascript" type="text/javascript" src="./include/jquery.js"></script>

 

<script language="javascript" type="text/javascript">

$(document).ready(function (){  

//使用普通dom获取文本框的值

//var document1=document.getElementById("content").value;

//alert(document1);

//使用jquery方式获取

  // var invalue=$("#content");//$(普通对象)转换为jquery对象

//alert(invalue.val());

//jquery对象转换成普通对象(-)

var domcon=$("#content").get(0);

alert(domcon.value);

//()

var domcon=$("#content")[0];

alert(domcon.value);

 } ); 

 </script>

</head>

<body>

<input type="text" value="jquery学习" id="content">

</body>

</html>