前言

在学习jQuery的之前，就对JavaScript已经进行了深入的学习。但是，对jQuery的学习中有很大的迷惑。这篇文章将会总结jQuery和js的区别

一、本质区别

1.概念及功能（两者之间的联系）：
JavaScript是用于Web客户端开发的脚本语言
jQuery是js的框架,基于js语言。功能：集合Ajax技术开发出来的js库，封装js和Ajax的功能，提供函数接口，简化js的操作。（注：在大多数的项目中，jquery 用的比较多）。
2.引用：
js代码需要写在中
jQuery需要在head标签中引用jQuery库：<script language="javascript" src="/js/jquery.min.js"></script>(本地引用)

二、用法区别

1.获取内容

在非表单元素中（定位元素）js使用的document.getElementById(“d”)等；jQuery则使用$().
js获取元素，文本的方法是innerHTML和innerText方法；jQuery需要获取元素的文本（具体的HTML代码），则使用text方法（HTML方法).

注：使用这两种方法的时候：
1.无参数：取值
2.有参数：赋值
3.这两种方法只能使用在非表单元素中

代码如下：

 $(function(){//onload事件console.log(" 我来了")//获取标签对象let  p = $('#p') ;//输出到控制台上console.log(p.html())console.log("----",p.text()) //取值})<body><p id= "p"><span>张无忌</span></p></body>

结果如下：

在表单元素中：js取值：div.value；赋值：div.value= xx；jQuery：div.val() -----有参数是赋值，无参数是取值。

2.设置css样式

JavaScript中设置css样式：比如说，p.style.backgroundColor = “green”,此处注意的是背景色的书写是驼峰式.
jQuery设置css样式：比如说，p.css(“color”,“deeppink”);其中两者所用到的css样式没有变化，但是就在书写的时候，需要注意一些。

重要：
1.js只能获取到内联样式，内嵌和外部的css样式获取不到。
2.jQuery既可以是内联的也可以是内嵌。

代码如下：

<style>
/* 省略css样式 */
</style>
window.onload = function info(){//获取P标签对象let p = document.getElementById("p") ;//只能得到内联样式，内嵌和外部的css的不到console.log("内联的color:",p.style.color);console.log("内嵌，外部的css样式width：",p.style.width);//jQuery获取css样式console.log("jQuery能得到内嵌的:",$(p).css("width")); }<body><p id= "p" style="color: #FF0000;" ><span>西游记</span></p></body>

3.属性（增删查）

方法（js）	描述
setAttribute（“参数一”,“参数二”）	设置属性，修改属性，只返回字符串
getAttribute("")	只有一个参数，此参数是属性名，返回当前元素节点的指定属性
setAttribute(“参数一”,“参数二”)	为当前元素节点`新增属性`
hasAttribute("")	返回一个布尔值，表示当前元素节点是否包含指定属性
removeAttribute("")	从当前元素节点移除属性

方法（jQuery）	描述
attr()	设置或返回匹配元素的属性和值，`两个参数，则是添加属性；一个参数，获取属性`
removeAttr("")	从所有匹配的元素中移除指定的属性

总结

通过查资料和借鉴，从三个方面完成了这篇文章，如有错误或概括不全，希指正。

jquery和JavaScript之间的联系和区别相关推荐

jQuery与JavaScript与ajax三者的区别与联系
jQuery与JavaScript与ajax三者的区别与联系简单总结: 1.JS是一门前端语言. 2.Ajax是一门技术,它提供了异步更新的机制,使用客户端与服务器间交换数据而非整个页面文档,实现页 ...
浅析HTML、CSS、JavaScript之间的联系与区别
HTML.CSS.JavaScript是前端学习非常重要的内容.Web可以被看做是一个有生命的物体或人体,HTML可以视为骨骼和肌肉,CSS可以视为皮肤和毛发,而JavaScript可以视为受一定支配 ...
Java和JavaScript之间的区别
1.简介我们将在本文中比较Java语言和JavaScript语言. JavaScript由Netscape开发. 它最初是用于客户端的脚本语言,后来又用作客户端和服务器脚本的语言. Java由Jam ...
java和javascript区别_java和javascript之间有什么区别
java和javascript之间有什么区别?本篇文章就给大家介绍java和javascript之间的区别,让大家了解java和javascript是什么?它们之间的差异有哪些.有一定的参考价值,有需 ...
asp是什么， javascript和php，asp区别，什么是 JavaScript 引擎， nodejs和vuejs的关系，nodejs和javascript区别
asp是什么 ASP有两个含义: 一是英文Application Service Provider的缩写,意思是网络应用服务供应商: 另一个是英文Active Server Page的缩写,是微软推出 ...
通过构建城市来解释HTML，CSS和JavaScript之间的关系
by Kevin Kononenko 凯文·科诺年科(Kevin Kononenko) 通过构建城市来解释HTML,CSS和JavaScript之间的关系 (The relationship betw ...
《jQuery与JavaScript入门经典》——第 1 章　动态Web编程简介 1.1理解Web服务器浏览器范式...
本节书摘来自异步社区<jQuery与JavaScript入门经典>一书中的第1章,第1.1节,作者:[美]Brad Dayley著,更多章节内容可以访问云栖社区"异步社区&quo ...
Java、Javascript、Javaweb三者的区别
首先,我们来说一下java 与 javaweb之间的关系 : 我们平常说的Java一般指Java SE,也就是Java Standard Edition,Java的标准版,一般用来开发桌面应用程序,但 ...
jQuery（JavaScript类库）
文章目录一.概述 1.1 介绍 1.2 网络资源 1.3 快速入门二.选择器 2.1 介绍 2.2 JavaScript和jQuery选择器区别三.事件 3.1 鼠标事件四.操作Dom元素学 ...

jquery和JavaScript之间的联系和区别

文章目录

前言

一、本质区别

二、用法区别

1.获取内容

2.设置css样式

3.属性（增删查）

总结

jquery和JavaScript之间的联系和区别相关推荐

最新文章

热门文章