原生js和jQuery优缺点对比
原生js缺点：
1、不能添加多个入口函数（window.onload），如果添加了多个入口函数，则会将前面的覆盖。
2、原生js的API名字都太长，太难记
例如：document.getElementById（）；style.border=‘’；textConten=‘’；等等。
3、原生js有时候代码会有些冗余。
例如：对两个按钮设置边框和文本，则需要遍历三次div
4、原生js有些属性或者方法，有些浏览器不兼容，如IE浏览器。
5、 原生js容错率比较低，前面的代码出错，后面的代码无法运行。
使用jQuery优点：
1、是可以写多个入口函数的。
2、jQuery的API名字都容易记忆，如$（‘#id’）即可获取。
3、jQuery代码简洁（隐式迭代）。
4、jQuery帮我们解决了浏览器兼容问题。
5、容错率较高，前面的代码出错，后面的代码不受影响。
以下给出案例js代码和jQuery代码以及各自运行截图对比：
js代码如下：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>js案例</title>
<style>
div {
height: 100px;
margin-top: 10px;
}
</style>
</head>
<body>
<input type="button" value="设置边框" id="btnOne"/>
<input type="button" value="设置文本" id="btnTwo"/>
<div></div>
<div></div>
<div></div>
</body>
</html>
jQuery代码如下：
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>标题</title>
<style>
div {
height: 100px;
margin-top: 10px;
}
</style>
</head>
<body>
<input type="button" value="设置边框" id="btnOne"/>
<input type="button" value="设置文本" id="btnTwo"/>
<div></div>
<div></div>
<div></div>
</body>
</html>
原生js和jQuery优缺点对比相关推荐
- span的取值与赋值（原生js与jquery） - 对比篇
文章目录 关于span的取值与赋值 - 原生js与jquery代码 一. span的`取值`: 1. `javascript` 2. `jquery` 二. span的`赋值`: 1. `javasc ...
- 原生js、jQuery实现选项卡功能
在大家在网上平常浏览网页的时候,想必各位都会看到选项卡功能,在这里给大家详解一下用原生js.jQuery如何来写一些基本的选项卡 话不多说,先给各位看一下功能图: 好了,下边 ...
- 原生js和jquery常用的DOM操作
前言 将原生JS和jquery里面的DOM操作进行了一下整理,方便以后温习. 创建元素节点 1.原生: document.createElement("div") 2.jquery ...
- html——原生js与jquery创建元素节点区别
学习完静态样式之后开始学习动态创建添加html元素,总结了下原生js与jquery生成元素区别. 1.javascript创建元素 创建select var select = document.cre ...
- 原生js与jquery的区别
原生js与jquery的区别 1.选择器: js: $('.car_img_con img')[0]; var jsObj = document.getElementsByClassName('sel ...
- 原生js与jQuery显示隐藏div的几种方法
原生Js与jQuery显示隐藏div的几种方法 简介:本文将会讲解,如何使用原生的JS和jquery来实现对于这个div盒子的隐藏 js 方式一 首先是进行js演示和讲解. 首先是display的方法 ...
- jq ajax请求php原声,原生JS与jQuery对AJAX的实现
原生JS与jQuery对AJAX的实现 一.定义 W3C里这么解释AJAX: AJAX = Asynchronous JavaScript and XML(异步的 JavaScript 和 XML). ...
- 原生js和jquery 遍历数组区别（forEach和each区别）
原生js和jquery 遍历数组区别(forEach和each区别) <script>var arr=[1,3,6,8,4];var obj={0:1,1:3,2:6,3:8,4:4};a ...
- html 对勾单选框,利用原生js和jQuery实现单选框的勾选和取消操作的方法
根据以下的Demo,大概就可以看的明白 Demo: window.onload = function(){ var dom_a = document.getElementById('a1'); var ...
最新文章
- C Primer+Plus（十一）
- springmvc 传对象报400_那么火的SpringMVC到底有什么过人之处呢
- linux subversion 根目录检出,经验总结：详解Linux下Subversion的安装配置记录 下
- clion IDEA 2019 Activation Code
- 问题:双击Excel文件提示文件找不到,只打开程序不同时打开文件,但通过打开对话框却能打开文件。
- Atitit io读取文件法 目录 1. 文件法 1 1.1. 异步读取文件: 1 1.2. 2.同步读取方法 1 1.3. 二进制读文件： 1 2. 读取api规范 1 3. Atitit 按照
- 2017年第六届数学中国数学建模国际赛(小美赛)比赛心得
- 新版PMP考试解题技巧有哪些？总结在这里
- Jenkins安装后设置，访问http://localhost:8080进入jenkins解锁，完成安装后的配置
- 【nmake】Nmake基本语法和Windows下的makefile.vc编写demo
- 不要重新发明轮子_重新发明轮子
- 详解 CatBoost 原理
- 【蓝桥杯】盾神与砝码称重——DFS（深度优先算法）
- 吴晓波：预见2021（跨年演讲 —— 08 超级城市大赛鸣枪）
- oracle查询dictionary,Oracle的DICTIONARY/DICT视图。
- 最新世界大学排名：计算机专业哪家强？
- 公司各岗位职责及权力
- 不是所有物联网平台都适合系统集成
- 关于程序员的几个小段子
- linux usb免驱麦克风,Linux下Skype使用免驱摄像头