两分钟了解jquery与javascript、js 三者间的区别
javascript、jquery、js这三者经常出现在我们的生活中，大家知道它们有什么相同和什么不同吗？下面我们就用两分钟来了解以下它们吧。
javascript：是浏览器中一种常见的脚本语言,以此来实现网页的动态以及和后端（数据库）的交互。
jquery：是javascript整合后的类库，通过操作jquery可以减少原生javascript语句的使用，从而提高效率。
js：则是javascript的一种简称。
区别概要：
1.jquery极大的简化了javascript，最大程度上做到了以最少代码完成更多功能的艰巨任务。
2.javascript对dom的加载只加载一次，jquery会加载多次。
3.jquery对dom的操作更加方便。如节点的获取。eg：$()
说明：提升对原生javascript和封装后的jquery两者理解最直接的方式就是在页面中不引入jquery来实现前后端的基础交互。
以下内容是为了区别理解jquery与js所整理的纪要：
jquery-和原生javascript写法：
1 定位元素
js：
document.getelementbyid("abc")
jquery ：
$("#abc") 通过id定位 $(".abc") 通过class定位 $("p") 通过标签定位
注意：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实际上不能用，上面这个测试过能用
js和jquery的区别
1. 根据id取元素
js:取到的是一个dom对象。
例：
var p = document.getelementbyid("one");
jquery:取到的是一个jquery对象。
例：
var p = $("#one");
2. 根据class取元素[在数组里面如果要取dom对象使用索引的方式，如果要取jquery对象使用eq()]
js:取到的是一个数组
例：
var p = document.elementsbyclassname("test");
jquery:
例：
var p = $(".test");
3. 根据name取元素
js：返回的是一个数组
例：
var bd = document.getelementsbyname(uid);
jquery：的方式是用 方括号，属性=一个值，不限制非要根据name来取值，jquery是根据属性来取元素
例：
$("[name='uid']");
4. 根据标签名取元素
js：返回的也是一个数组
例：
var p = document.getelementsbytagname("p");
jquery：和样式表里面给所有p加样式的方法一样，在双引号内直接写标签名
例：
$("p");
eg:指定子目录元素对象获取：var p = $("p span");——有很多组合方式
操作内容
1. 非表单元素（如果是文本就用text方法，如果是html代码就用html方法）
例：
1.1. 无参数的情况下是取值
p.text();
p.html();
1.2. 有参数的情况下是赋值
p.text("aaaa");
p.html("aaaa");
2. 表单元素
js：
2.1. 取值
p.value;
2.2. 赋值
p.value = 'xxx';
juqery：
2.3. 取值
p.val();
3.4. 赋值
p.val('xxx');
操作属性
js操作属性
设置|修改属性：
p.setattribute("","");
删除属性
p.removeattribute("");
获取属性
p.getattribute();
jquery里面用来操作属性的方法
添加属性：
p.attr("width","20%");
移除属性：
p.removeattr("width");
获取属性：
p.attr("width");
操作样式
js操作样式-关键字是[style]
例：
p.style.backgroundcolor = "red";
jquery里面操作样式的关键字是css
例：
p.css("background-color","yellow");
——把这个p的背景色变为黄色，在这里css里面所有的样式和css样式表里面的样式是一模一样的没有任何变化
js操作样式的方法只能获取内联样式，不能取内嵌的和外部的！！！！！
jquery操作样式的方法可以是内联的也可以是内嵌的
感谢大家的阅读，希望大家收益多多。
本文转自：https://blog.csdn.net/dalei9243/article/details/79804789
推荐教程：《js教程》
以上就是两分钟了解jquery与javascript、js 三者间的区别的详细内容。