jQuery是一个快速的，小巧的，具有强大功能的JavaScript库。

它的基本功能包括:

1）访问和操作DOM元素

2）控制页面样式（可以兼容各种浏览器）

3）对页面事件的处理

4）大量插件在页面中的运用

5）与Ajax技术的完美结合

jQuery改变了众多的程序员使用 JavaScript的方式。

jQuery官方主页代码示例:

1) DOM遍历及操作

将class为continue的<button>的文本内容设置成"Next Step..."

1
$( "button.continue" ).html( "Next Step..." )

2)事件处理

当点击了#button-container容器下的任何一个 button时,将会显示隐藏的#banner-message button,这个button是使用CSS的display:none隐藏的.

1
2
3
4
var hiddenBox = $( "#banner-message" );
$( "#button-container button" ).on( "click", function( event ) {
  hiddenBox.show();
});

3)Ajax

调用服务器上的/api/getWeather程序，并传递参数为zipcode=97201,将返回的结果在#weather-temp中显示出来。

1
2
3
4
5
6
7
8
9
$.ajax({
  url: "/api/getWeather",
  data: {
    zipcode: 97201
  },
  success: function( data ) {
    $( "#weather-temp" ).html( "<strong>" + data + "</strong> degrees" );
  }
});

其它的一些举例:

1) 搭建jQuery开发环境

(1）在http://jquery.com下载。

(2）在script标签中引用：

1
<script language="javascript" type="text/javascript" src="Jscript/jquery-1.7.1.js"></script>

2) 简单弹出窗口的例子

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<html>
<head>
    <title>jQuery程序1</title>
    <script language="javascript" type="text/javascript"
            src="jquery/jquery-1.7.1.js"></script>
    <script type="text/javascript">
           $(document).ready(function(){
              alert("Hello,http://www.169it.com!!!");         
           })
    </script>
</head>
<body>
</body>
</html>

$(document).ready(function(){})即是jQuery代码，相当于window.onload，可以简写成$(function(){})

3) jQuery的链式写法

1
2
3
4
5
6
7
<script type="text/javascript">
        $(function(){
         $(".divTitle").click(function(){
           $(this).addClass("divCurrColor").next(".divContent").css("display","block");
         });
        });
   </script>

4) jQuery访问DOM对象

JavaScript方式：

 
1
2
3
4
www.169it.com
var tDiv=document.getElementById("divTmp");
var oDiv=document.getElementById("divOut");
var cDiv=tDiv.innerHTML;
oDiv.innerHTML=cDiv;

jQuery方式：

1
2
3
4
var tDiv=$("#divTmp");
var oDiv=$("#divOut");
var cDiv=tDiv.html();
oDiv.html(cDiv);

5) 动态切换CSS样式：

1
2
3
4
5
$(function(){
$(".divDefault").click(function(){
$(this).toggleClass("divClick").html("点击后的样式");
});
});

jQuery主页最新版下载:

目前jQuery包括1.x系列和2.x系列，下载地址如下:

jQuery下载地址

本文来源:jQuery概述,代码举例及最新版下载

jQuery概述,代码举例及最新版下载的更多相关文章

  1. jQuery 概述

    jQuery 概述 版权声明:未经博主授权,内容严禁分享转载! 什么是 JavaScript 类库 JavaScript 类库是指已经被封装好的一系列 JavaScript 函数,能够实现一些特定的功 ...

  2. 14种网页图片和文字特效的jQuery插件代码

    1.网页图片3d旋转jQuery代码 演示和下载地址 2.存css3实现的tabl选项卡代码 演示和下载地址 3.jQuery标签旋转代码 演示和下载地址 4.鼠标悬浮的图片选项卡代码 演示和下载地址 ...

  3. 选择29部分有用jQuery应用程序插件（免费点数下载）

    免积分下载:http://download.csdn.net/detail/yangwei19680827/7238711 原文地址:http://www.cnblogs.com/sxwgf/p/36 ...

  4. 电商网站jQuery放大镜代码

    分享一款电商网站jQuery放大镜代码.这是一款基于jquery.elevatezoom插件实现的类似淘宝放大镜代码,提供40多种参数,可自由配置多种效果,适合电商或图片类网站使用.效果图如下: 在线 ...

  5. Apache服务器最新版下载、安装及配置（win版）

    Apache服务器最新版下载.安装及配置(win版) Apache的下载: 登录http://httpd.apache.org/download.cgi 这个地址,找到2.4.10,如下图位置:   ...

  6. SSL握手通信详解及linux下c/c++ SSL Socket代码举例(另附SSL双向认证客户端代码)

    SSL握手通信详解及linux下c/c++ SSL Socket代码举例(另附SSL双向认证客户端代码) 摘自: https://blog.csdn.net/sjin_1314/article/det ...

  7. Unit01： jQuery概述 、 jQuery选择器 、 jQuery操作DOM

    Unit01: jQuery概述 . jQuery选择器 . jQuery操作DOM 使用jQuery放大字体: <!DOCTYPE html> <html> <head ...

  8. nexus 3.x最新版下载安装和上传下载jar

    注意: nexus 3.x最新版好像不用下载索引了,目前我使用一些基本功能没有索引也能耍的很6 下载 nexus最新版下载https://www.sonatype.com/download-oss-s ...

  9. HTML Select 标签选择后触发jQuery事件代码实例

    页面设计原由: 因为很多客户不知道如何来到我们公司,领导想让我在微信公众号上面做一个链接,客户可以直接通过微信公众号打开地图并导航到我们公司的办公地点. 实现起来并不难,但由于公司有很多办事处,所以需 ...

随机推荐

  1. status pending状态

    开发采用ssh,注解的方式,事物也application.xml配置了,但是在业务层没有使用@Transactional造成浏览器一直处于status pending状态,为什么没有使用@Transa ...

  2. 【不积跬步，无以致千里】安装roundcube 时出现 “DSN (write): NOT OK(SQLSTATE[HY000] [2002] No such file or directory)”

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...

  3. 【搬运】【备份】imrc文件

    存档. " ============================================================================= " < ...

  4. EasyUI基础入门之Parser(解析器)

    前言 JQuery EasyUI提供的组件包含功能强大的DataGrid,TreeGrid.面板.下拉组合等.用户能够组合使用这些组件,也能够单独使用当中一个.(使用的形式是以插件的方式提供的) Ea ...

  5. BW导航属性设置

    BW中的Attribute(属性)分为Display Att.和Navigation(导航) Att.,这里我就简称Dis. att和Nav. att了,导航属性可以做为变量来查询和做限制 1.首先进 ...

  6. android 访问SMS短信收件箱

    访问 SMS收件箱是另一个常见的需求.首先,需要将读取 SMS 的权限   <uses-permission android:name="android.permission.READ ...

  7. iOS NSString常用用法大全

    版权声明:本文为博主Atany原创文章,未经博主允许不得转载.博客地址:http://blog.csdn.net/yang8456211 一.NSRange 在对NSString介绍之前,我们先要了解 ...

  8. iOS开发——实用篇Swift篇&状态栏操作

    状态栏操作 在Swift开发过程中,针对状态栏操作的过程有很多. 1.在ViewController中操作当前ViewController的状态栏 /** 隐藏状态栏 */ override func ...

  9. online ddl 工具之pt-online-schema-change

      MySQL ddl 的问题现状 在运维mysql数据库时,我们总会对数据表进行ddl 变更,修改添加字段或者索引,对于mysql 而已,ddl 显然是一个令所有MySQL dba 诟病的一个功能, ...

  10. Jquery Validate根据其他元素的事件来触发单个元素的异步校验

    场景:在做一个车辆信息管理模块,而车牌是通过车牌颜色和车牌号码来确定唯一性的,录入车牌信息时需对车牌进行唯一性校验.