web前端三大主流框架对比 jquery标签点击事件_生活百科

简单总结：
1、JS是一门前端语言。
2、Ajax是一门技术，它提供了异步更新的机制，使用客户端与服务器间交换数据而非整个页面文档，实现页面的局部更新。
3、jQuery是一个框架，它对JS进行了封装，使其更方便使用。jQuery使得JS与Ajax的使用更方便
关系比喻：
若把js比作木头，那么jquery就是木板（半成品）
jQuery与ajax都是js的一个框架，各有各的功能，若js是父亲的话，jquery与ajax就是两个儿子
详细情况：
1.javascript是一种在客户端执行的脚本语言。ajax是基于javascript的一种技术，它主要用途是提供异步刷新（只刷新页面的一部分，而不是整个页面都刷新）。一个是语言,一个是技术,两者有本质区别.2.javascript是一种在浏览器端执行的脚本语言，Ajax是一种创建交互式网页应用的开发技术，它是利用了一系列相关的技术其中就包括javascript 。1、JavaScriptjavaScript的简写形式就是JS，一种广泛用于客户端Web开发的脚本语言，常用来给HTML网页添加动态功能（其编写的程序可以被嵌入到HTML或XML页面中，并直接在浏览器中解释执行）。

组成部分：

核心（ECMAScript）、文档对象模型（Document Object Model，简称DOM）、浏览器对象模型（Browser Object Model，简称BOM）

文章插图

文章插图
解释：
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=https://www.yf-zs.com/shuma/”/js/jquery.min.js”> //引用
库文件既可以放在本地，也可以直接使用知名公司的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 = https://www.yf-zs.com/shuma/“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;
jQueryabc.css(‘font-size’, 20);
JS
abc.className=”test”;
JQueryabc.removeClass();
abc.addClass(“test”);
9 判断复选框是否选中
jQuery
if(abc.attr(“checked”) == “checked”)注意：网上说的.attr(“checked”) == true实际上不能用，上面这个测试过能用
JS和JQUERY的区别①.根据ID取元素
{
JS:取到的是一个DOM对象。
例：var div = document.getElementByID(“one”);
JQUERY:取到的是一个JQUERY对象。
【web前端三大主流框架对比 jquery标签点击事件】例：var div = $(“#one”);——括号里面是根据某个东西来找，相当于一个选择，如果我们要根据ID来找，在样式表里的ID是用#来表示的，所以在这里我们直接带入井号，整句的意思就是根据ID为one的来查找。