抛弃JQ,回归原生js……
之前我写过一篇文章叫做《jq不会被淘汰》……而事实上它真的不会被淘汰,因为即使在mvvm框架盛行的今天,原生js的api越来越友好的今天,jq依然在用户量上是霸主……
但是今天我们要讨论的是,抛弃jq,拥抱原生js……
再说正题之前,我们先来看看jq比js,解决了哪些问题,哪里更优秀
1.首当其冲是浏览器兼容,jq本身做了很多浏览器的兼容,这导致了它的代码变得臃肿,但是不得不说,这方面jq做的很好√
2.语法比较简洁,jq的代码语法是很简洁的,因为层层封装后,为的就是易用
3.jq封装的ajax方法很好用,平时我们做前后端分离的时候,请求数据是必不可少的,jq的ajax就比较优雅,而同样的,如果是原生js,写一个ajax代码量可不少……
我说我们应该抛弃jq,拥抱原生,其实不是瞎说的……
首先,ie浏览器用户越来越少,如今已经很少很少了,就算一般人的浏览器装了ie内核的,它们多半也有个极速模式……那就是谷歌内核的……
所以为了那一丢丢的用户,浏览器向下兼容变得不那么重要了……
与其做兼容,不如做引导,如ie下提示更换浏览器……
然后第二点,关于代码语法啥的,的确jq的语法很简洁,也长的比较好看,比如相同的操作一个id
jq:$('#id') 原生:document.getElementById('id')
可以看到,虽然原生js的代码比较长,但是语义化很好啊,一看就知道get element by id ,就是取元素通过id……这理应是我们该提倡的……虽然dom多了会变得不好看,但是……
一旦dom操作很多了就不提倡操作dom了,更提倡vue、react这种不直接操作dom(操作虚拟dom)的方案了……
然后关于ajax,jq的确封装了比较好用的方法,原生不太方便,但是现在我个人比较提倡fetch,而不是ajax,所以原生js里完全可以直接fetch替代ajax
所以jq的这个优势也不复存在了……
然后再说一下原生js的好处
首先就是性能好,这个真的没得说,毕竟是原生……
然后,原生js的api也在更新,现在的很多api都比较新比较能接受了……
再就是,在mvvm框架盛行的今天,我们不可能在这些框架里引入jq,但是却可以天然的写原生js没毛病……
所以……综上所述……
仅代表个人观点哈,不接受反驳(⊙o⊙)…
目前在写的个人项目的后台部分就是原生js的技术桟,甚至都没有用vue,毕竟后台嘛,简陋点没啥的√
抛弃JQ,回归原生js……的更多相关文章
- jq与原生js实现收起展开效果
jq与原生js实现收起展开效果 (jq需自己加载) <!DOCTYPE html> <html> <head> <meta charset="UTF ...
- 导航栏中各按钮在点击当前按钮变色其他按钮恢复为原有色的实现方法(vue、jq、原生js)
一.vue如何实现? 代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...
- jq 与原生js 方法互相转换
最近在用mui写页面,当然了在移动App里引入jq或zepto这些框架,肯定是极不理性的.虽然jq很简单,但是也有兼容问题,js基础是很重要的,jq的成功当时是因为ie6.7.8.9.10.chrom ...
- jq 和 原生js进行传输文件ajax请求
<body> <input id="file_upload" name="file_upload" type="file" ...
- JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性)
JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性) 以下内容: 一.获取元素的属性 二.设置元素的属性 三.删除元素的属性 一.获取元素的属性 1-原生JS 获取属性 .ge ...
- 折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
折腾一天,获取下列多选框的所有选中值,原生js可直接通过obj.val()来获取,可jq不行,要通过循环取值来获取;
- 原生JS与JQ获取元素的区别
刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...
- 原生JS 和 JQ 获取滚动条的高度,以及距离顶部的高度
JQ:相对比较简便 获取浏览器显示区域(可视区域)的高度 : $(window).height(); 获取浏览器显示区域(可视区域)的宽度 : $(window).width(); 获取页面的文档高度 ...
- jq商品展示图放大镜 and 原生js和html5写的放大镜效果 ~~效果不错
<!DOCTYPE HTML><html lang="en-US"><head> <meta charset="UTF-8&qu ...
随机推荐
- gitlab服务器搭建教程
gitlab服务器搭建教程 ----2016年终总结 三 参考https://bbs.gitlab.cc/topic/35/gitlab-ce-8-7-%E6%BA%90%E7%A0%81%E5%AE ...
- [js高手之路]html5 canvas动画教程 - 下雪效果
利用canvas,实现一个下雪的效果,我们先预览下效果: 我们先分析下这个效果: 1,随机产生雪花 2,雪花的产生不是同时产生,而是有先后顺序的 3,雪花怎么表示 4,怎么源源不断的下雪 5,雪花有大 ...
- 带你领会 线性代数 微积分的本质 3blue1brown 动画效果帅出天际
前段时间在 哔哩哔哩 上偶然发现了 3blue1brown 精美的动画,配上生动的讲解,非常适合帮助建立数学的形象思维 其中两大系列,非常值得反复观看: 线性代数的本质(Essence of line ...
- JSP中的九大隐式对象及四个作用域
在这篇博文中,我们将讨论和学习JSP中的隐式对象及四个作用域. 一.九大隐式对象 这些对象是JSP容器为每个页面中的开发人员提供的Java对象,开发人员可以直接调用它们而不用显式地声明它们再调用. J ...
- python日记
今天学习了Python的一些基本知识,就是简单的输入输出.因为我安装的Python环境是3.6版本的,因此我说的自己体会到的问题都是基于这个版本而得出的问题,说一下今天感觉要注意的要点吧. 1.首先是 ...
- Java8之旅(七) - 函数式备忘录模式优化递归
前言 在上一篇开始Java8之旅(六) -- 使用lambda实现Java的尾递归中,我们利用了函数的懒加载机制实现了栈帧的复用,成功的实现了Java版本的尾递归,然而尾递归的使用有一个重要的条件就是 ...
- js页面间通信方法(storage事件)(浏览器页面间通信方法)
在写页面的时候有时会遇到这样的需求,需要两个页面之间传递数据或者一个事件.这个时候,就需要用到我今天所要讲的storage事件,学习这个事件之前,需要先了解localStorage的用法.具体用法可以 ...
- sql语句如何查询一个表中某两个字段的相同数据?
Select Name,ID From A group by Name,ID having count (*)>1
- cmd 编译java WebService
格式:wsimport -s "src目录" -p "生成类所在包名" -keep "wsdl发布地址" 示例: wsimport -s G ...
- Python Fabric远程自动部署简介
Fabric是一个Python(2.5-2.7)库,用于简化使用SSH的应用程序部署或系统管理任务. 它提供的操作包括:执行本地或远程shell命令,上传/下载文件,以及其他辅助功能,如提示用户输入. ...