js和jquery的区别有哪些?

在学习js的时候我们肯定能够接触到jquery,那么,js与jquery之间有什么区别呢?本篇文章将给大家来分享关于jquery与js之间的区别比较。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

js是一种脚本语言,常用于网页客户端编程,使网页在客户端浏览器中,实现更多地动态功能,表现出更加丰富的视觉效果。

jQuery 是一个简洁而快速的 JavaScript 库,可用于简化事件处理,HTML 文档遍历,Ajax 交互和动画,以便快速开发网站。jQuery 简化了 HTML 的客户端脚本,从而简化了 Web 2.0 应用程序的开发。

js和jquery的区别

本质上的区别

JavaScript 是通过标签插入到HTML页面,可由所有的现代浏览器执行的一种轻量级的编程语言。

JQuery是一个JavaScript函数库。或者说是JavaScript。

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

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

例如:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>  
//Google
 
//G或者:
 
<script src="http://code.jquery.com/jquery-1.6.min.js"></script> 
//jQuery 官方 

JavaScript是网页编程语言,而jQuery是一个基于js编写的框架;

jquery就是基于JavaScript语言写出来的一个框架,实质上还是js而已

So:

  • jQuery 是一个 JavaScript 库;

  • jQuery 极大地简化了 JavaScript 编程;

  • jQuery 使JavaScript更好用;

  • jquery就是要用更少的代码,漂亮的完成更多的功能;

最直观的区别就是:外观上jQuery对象比js对象多了"$()"。

操作属性

JavaScript里面用来操作属性的方法:

div.setAttribute("","");——设置属性、修改属性

div.removeAttribute("");——移除属性,引号里面写一个属性名

div.getAttribute();——获取属性

jQuery里面用来操作属性的方法:

添加属性:div.attr("test","aa"); ——给这个attr方法加入参数,属性名叫做test,属性的值是aa

移除属性:div.removeAttr("test"); ——移除test这条属性

获取属性:div.attr("test"); —— 在attr方法里面直接写入一个属性的名就可以了

操作样式

JavaScript里面操作样式的关键字是style

例:div.style.backgroundColor = "red";——把这个div的背景色设置成为了红色

1.jpg

jQuery里面操作样式的关键字是css

例:div.css("background-color","yellow");——把这个div的背景色变为黄色,在这里CSS里面所有的样式和css样式表里面的样式是一模一样的没有任何变化。

2.jpg

JavaScript操作样式的方法只能获取内联样式,不能取内嵌的和外部的。

jQuery操作样式的方法可以是内联的也可以是内嵌的。

一些方法对比:

⑴使用JavaScript和jQuery分别加载DOM

JavaScript只会执行一次,而jQuery会执行多次

⑵使用JavaScript和jQuery获取ID

JavaScript:

document.getElementById(‘idName')

JQuery:

$('#idName')

⑶使用JavaScript和jQuery获取class

JavaScript没有默认的获取class的方法

JQuery:

$('.className')

使用jQuery最大的好处是少量的代码做更多的事情,与JavaScript相比,jQuery的语法更加简单。

更多网站前端开发知识,请查阅 HTML中文网 !!

以上就是js和jquery的区别有哪些?的详细内容,更多请关注html中文网其它相关文章!

赞(0) 打赏
未经允许不得转载:html中文网首页 » JavaScript 答疑

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址

前端开发相关广告投放 更专业 更精准

联系我们

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏