Google提供的jquery包:

http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js

jQuery官方的jquery包:

http://code.jquery.com/jquery-1.6.min.js

区别如下:

1 定位元素

JS 
  document.getElementById("abc") 
jQuery 

  $(".abc")   通过class定位 
  $("div")     通过标签定位
  $("#id")     通过id定位

  需要注意的是JS返回的结果是这个元素,jQuery返回的结果是一个JS的对象。以下例子中假设已经定位了元素abc。

2 改变元素的内容

JS 
  abc.innerHTML = "test"; 
jQuery 
  abc.html("test");

3 显示隐藏元素 
JS 
  abc.style.display = "none"; 
  abc.style.display = "block"; 
jQuery 
  abc.hide(); 
  abc.show();  

  abc.toggle();   //在显示和隐藏之间切换(2012.4.21更新)

4 获得焦点 
  
JS和jQuery是一样的,都是abc.focus(); 

5 为表单赋值 
JS 
  abc.value = "test"; 
jQuery 
  abc.val("test");

6 获得表单的值 
JS 
  alert(abc.value); 
jQuery 
  alert(abc.val());

7 设置元素不可用 
JS 
  abc.disabled = true; 
jQuery 
  abc.attr("disabled", true);    不可用

  abc.removeAttr("disabled");     恢复可用

8 修改元素样式
JS

  abc.style.fontSize=size;
jQuery
  abc.css('font-size', 20);

9 修改元素class

JS
  abc.className="test";
JQuery
  abc.removeClass(); 
  abc.addClass("test");

10 Ajax
JS

  自己创建对象,还得处理浏览器兼容的等问题。
jQuery
  $.get("abc.php?a=1&b=2", recall);

  postvalue = "a=b&c=d&abc=123";
  function recall(result) {
    alert(result);
    //如果返回的是json,则如下处理
    //result = eval('(' + result + ')'); 
    //alert(result);
  }
  $.post("abc.php", postvalue, recall);

11 判断复选框是否选中
jQuery

  if(abc.attr("checked") == "checked")
  注意:.attr("checked") == true实际上不能用

12 跨域访问
JS
 方式1:
  createXMLHTTPRequext();
  xmlhttp.Open("get", "http://localhost/example.htm", false);xmlhttp.Send(xmldoc);
 方式2:
  <script type="text/javascript" src="http://remoteserver.com/remote.js"></script>
 方式3:
  $.get(url,{params:str },function(data,status){})
  .fail(function() {})
  .always(function() {});
jQuery
 方式1:
  $.ajax({  
    type: 'POST',    
    url: url ,     
    data: data ,     
    dataType: dataType,   
    success: success
  });
 方式2:
  $.ajax({   
    type: "get",   
    async: false,   
    url: "http://flightQuery.com/jsonp/flightResult.aspx?code=CA1998",   
    dataType: "jsonp",   
    jsonp: "callback",        //传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)   
    jsonpCallback:"flightHandler",  //自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据  
    success: function(json){ },  
    error: function(){}
  });

JQuery 和JavaScript的区别的更多相关文章

  1. jquery和javascript的区别(常用方法比较)

    jquery 就对javascript的一个扩展,封装,就是让javascript更好用,更简单.人家怎么说的来着,jquery就是要用更少的代码,漂亮的完成更多的功能.JavaScript 与JQu ...

  2. jquery和javascript的区别

    jquery 就对javascript的一个扩展,封装,就是让javascript更好用,更简单,为了说明区别,下面与大家分享下JavaScript 与JQuery 常用方法比较 jquery 就对j ...

  3. 2018-08-26 jQuery与javaScript的区别及核心方法

    1.jq对象就是js new Object 生成的普通对象. 2.jq对象与js对象,他们的方法不能共用! 3.jq对象与js对象的相互转化: js对象转jq对象 -> $(js_obj);// ...

  4. jQuery页面加载完毕事件及jQuery与JavaScript的比较

    1.jQuery概述 jQuery是一个JavaScript库,它集成了JavaScript.DOM.CSS和Ajax,简化了JavaScript编程,提倡write less, do more. 2 ...

  5. JQuery笔记:JQuery和JavaScript的联系与区别

    来源:http://www.ido321.com/1019.html ps:LZ觉得这个标题有点大了,超出了能力范围,不喜勿碰.目前只记录LZ能力范围内的,日后持续补充. 一.JQuery对象和DOM ...

  6. 【Python全栈-JavaScript】JavaScript的window.onload()与jQuery 的ready()的区别

    JavaScript的window.onload()与jQuery 的ready()的区别 做web开发时常用Jquery中$(document).ready()和JavaScript中的window ...

  7. jQuery.extend和jQuery.fn.extend的区别【转】

    解释的很有意思,清晰明了又有趣,转来分享下,哈哈哈 jQuery.extend和jQuery.fn.extend的区别,其实从这两个办法本身也就可以看出来.很多地方说的也不详细.这里详细说说之间的区别 ...

  8. JQUERY与JS的区别

    JQUERY与JS的区别 <style type="text/css"> #aa { width:200px; height:200px; } </style&g ...

  9. jquery deferred done then区别

    jquery deferred done then区别 deferred是jquery 对promise的实现. 以下内容基于jquery 1.8及以上版本 deferred具有then done等属 ...

随机推荐

  1. nios II--实验1——hello_world硬件部分

    hello_world 硬件开发 新建原理图 1.打开Quartus II 11.0,新建一个工程,File -> New Project Wizard…,忽略Introduction,之间单击 ...

  2. Myeclipse 2015 stable 2.0 完美破解方法

    2015-08-21  以前写了一篇<Myeclipse 2015 stable 1.0 完美破解方法>,现 在跟新一下Myeclipse 2015 stable 2.0 破解方法,此方法 ...

  3. 十天冲刺---Day2

    站立式会议 站立式会议内容总结: git上Issues新增内容: 燃尽图 照片

  4. 《锋利的jQuery》读书笔记

    jQuery理念:write less, do more! 第 一 章一:jQuery简介 a:轻量级 b:强大选择器 c:DOM封装 d:ajax封装 e:不污染顶级变量 只建立一个jQuery对象 ...

  5. .net的Hello World之旅

    class Program    {        //这是主函数,是程序的入口        static void Main(string[] args)        {            ...

  6. 【BZOJ 2733】【HNOI 2012】永无乡 Splay启发式合并

    启发式合并而已啦,, 调试时发现的错误点:insert后没有splay,把要拆开的树的点插入另一个树时没有把ch[2]和fa设为null,找第k大时没有先减k,,, 都是常犯的错误,比赛时再这么粗心就 ...

  7. 素数筛 uva 543

    给你一个n求出n由2个奇质因子的和  这2个因子差最大 没有就输出'Goldbach's conjecture is wrong. #include<stdio.h> #include&l ...

  8. Android中图像变换Matrix的原理、代码验证和应用(二)

    第二部分 代码验证 在第一部分中讲到的各种图像变换的验证代码如下,一共列出了10种情况.如果要验证其中的某一种情况,只需将相应的代码反注释即可.试验中用到的图片: 其尺寸为162 x 251. 每种变 ...

  9. C#-WinForm-跨窗体 构造函数传值 及应用—登录式窗口传值、如何关闭主页面时关闭应用程序、如何打开唯一窗口—★★★★★五星重量级

    构造函数可以传任意类型的值,并可以同时传多个值 结构函数传值的初步应用--简单的登陆式界面 现在我有两个窗体Form3和Form4,如下,如何点击Form3中的按钮后,打开Form4并将Form3中的 ...

  10. 【奶昔队ROUND#1】

    奶昔队Round #1 热身 (奶昔队不是真正的队,是群) CodeForces 435C Cardiogram 模拟,不过我做的时候不是模拟,是计算...(写了好久,还wa了几次),现在看了别人的代 ...