• 技术文章 >web前端 >js教程

    jQuery JavaScript ajax区别是什么

    coldplay.xixicoldplay.xixi2020-11-20 10:52:25原创49

    jQuery JavaScript ajax区别:1、javaScript广泛用于客户端Web开发的脚本语言,常用来给HTML网页添加动态功能;2、AJAX创建交互式网页应用的网页开发技术;3、jQuery方便地为网站提供AJAX交互。

    jQuery JavaScript ajax区别:

    1、JavaScript

    javaScript的简写形式就是JS,一种广泛用于客户端Web开发的脚本语言,常用来给HTML网页添加动态功能(其编写的程序可以被嵌入到HTML或XML页面中,并直接在浏览器中解释执行)。

    组成部分:

    核心(ECMAScript)、文档对象模型(Document Object Model,简称DOM)、浏览器对象模型(Browser Object Model,简称BOM)

    描述:

    2、Ajax

    AJAX即“Asynchronous JavaScript and XML”(异步JavaScript和XML),AJAX并非缩写词,而是由Jesse James Gaiiett创造的名词,是指一种创建交互式网页应用的网页开发技术。

    组成:

    描述:

    3、jQuery

    jQuery是一个快速的,简洁的javaScript库,使用户能更方便地处理HTML documents、events、实现动画效果,并且方便地为网站提供AJAX交互。

    特点:

    jQuery是当前很流行的一个JavaScript框架,使用类似于CSS的选择器,可以方便的操作HTML元素,拥有很好的可扩展性,拥有不少插件。

    描述:

    二、三者的关系

    下面我用一张导图来阐述这三者的关系:

    解释:

    javaScript是用于Web客户端开发的脚本语言,Ajax是基于JS语言,主要组合JS、CSS、XML三种技术的新技术,是用于创建交互式网页应用的网页开发技术。jQuery是JS的框架,基于JS语言,集合Ajax技术开发出来的JS库,封装JS和Ajax的功能,提供函数接口,大大简化了Ajax,JS的操作。

    项目中用jQuery比较多,具体讲讲他。

    jQuery能大大简化JavaScript程序的编写

    要使用jQuery,首先要在HTML代码最前面加上对jQuery库的引用,比如:

    <script language="javascript" src="/js/jquery.min.js"></script>   //引用

    库文件既可以放在本地,也可以直接使用知名公司的CDN(CDN加载jquery的好处),好处是这些大公司的CDN比较流行,用户访问你网站之前很可能在访问别的网站时已经缓存在浏览器中了,所以能加快网站的打开速度。另外一个好处是显而易见的,节省了网站的流量带宽。

    Google提供的

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

    jQuery官方的

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

    jQuery代码具体的写法和原生的Javascript写法在执行常见操作时的区别如下:

    1 定位元素

    JS

    document.getElementById("abc")

    jQuery

    $("#abc") 通过id定位

    $(".abc") 通过class定位

    $("div") 通过标签定位

    需要注意的是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(); //在显示和隐藏之间切换、

    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);

    8 修改元素样式

    JS

    abc.style.fontSize=size;

    jQuery

    abc.css('font-size', 20);

    JS

    abc.className="test";

    JQuery

    abc.removeClass();

    abc.addClass("test");

    9 判断复选框是否选中

    jQuery

    if(abc.attr("checked") == "checked")

    注意:网上说的.attr("checked") == true实际上不能用,上面这个测试过能用

    相关免费学习推荐:JavaScript(视频)

    以上就是jQuery JavaScript ajax区别是什么的详细内容,更多请关注php中文网其它相关文章!

    本文原创发布php中文网,转载请注明出处,感谢您的尊重!
    专题推荐:jQuery JavaScript ajax
    上一篇:有哪些常用的jquery UI框架 下一篇:jquery怎么样判断值是否是url地址
    第14期线上培训班

    相关文章推荐

    • jQuery javascript获得网页的高度与宽度的实现代码_javascript技巧• jQuery javaScript捕获回车事件(示例代码)_jquery• 一起看看Java Ajax jsonp跨域请求• jquery如何处理ajax缓存问题

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网