认为不需要 jQuery 的理由如下： IE7 及更低版本的浏览器的市场份额已经低到忽略的地步。而用 IE8 及更高版本的浏览器的原生 API 来实现 jQuery 提供的功能并不是很麻烦。...比如： /* 选取元素 */ // IE8+ document.querySelectorAll(选择器); // jQuery $(选择器); /* Ajax */ // IE8+ var request...在这些情况下，用 MVVM 的框架是个不错的选择： MVVM 做页面的交互的做法是，在 HTML 中，设置好了 DOM 与数据的关系。当数据改变时，框架会更新 DOM。...对我来说，对于一般的项目，我都会用 jQuery，毕竟 jQuery 大小不大，比如，jquery-3.0.0-beta1.min.js 在没 gzip 压缩前也就 86 KB。...参考链接 YOU MIGHT NOT NEED JQUERY Why jQuery is still relevant Choosing Vanilla JavaScript in 2016 jQuery
核心功能; DOM(遍历/选择器); 基于原型的对象系统; AJAX; 动画; 事件系统; 正则表达式; 函数作为第一类对象; 闭包; 数学库; 数组库; 字符串库 开始使用 Vanilla JS是世界上最轻量的...javascript 框架，浏览器向站点发送请求前就已经把Vanilla JS加载在浏览器里了。...使用Vanilla JS只需在应用的HTML里加入这行： vanilla.js"> 当你部署你的应用的时候，使用这个更快的方法： 没错！...没有任何代码，Vanilla JS 太流行了，所有的浏览器在十年前就已经内置了它。...性能比较 根据ID获取DOM元素 框架 代码 次数/秒 Vanilla JS document.getElementById('test-table'); 12,137,211 Dojo dojo.byId
没有通过CSS选择器查询DOM元素的标准方法，也没有对元素的视觉样式进行动画处理的标准方法，而由Internet Explorer开创的XMLHttpRequest接口与许多其他api一样，在浏览器之间是不一致的...最重要的是，使用jQuery在一个浏览器中构建的JavaScript特性通常也可以在其他浏览器中工作。...我们可以很容易地用轻量级库封装事件委托模式； 随着JavaScript语言的发展，jQuery提供的一些语法糖已经变得多余了。...因此，即使那些使用JS增强的web表单和其他UI元素通常也会在浏览器中禁用JavaScript。在某些情况下，我们能够完全删除某些遗留行为，而不必在vanilla JS中重写它们。...我们只在绝对必要时才尝试提供这些polyfill，即作为单独的“兼容性”JavaScript包的一部分提供给过时的浏览器。
开发者直接使用JavScript标准语法，就能同时在各大浏览器运行，不再需要通过jQuery获取兼容性。...下面就探讨如何用JavaScript标准语法，取代jQuery的一些主要功能，做到jQuery-free。 ?...一、选取DOM元素 jQuery的核心是通过各种选择器，选中DOM元素，可以用querySelectorAll方法模拟这个功能。 ...myList = Array.prototype.slice.call(myNodeList); 二、DOM操作 DOM本身就具有很丰富的操作方法，可以取代jQuery提供的操作方法。...fd : null); } 然后，基于request函数，模拟jQuery的get和post方法。
最重要的是，使用 jQuery 在一个浏览器中构建的 JavaScript 功能通常也可以在其他浏览器中使用，它对浏览器的兼容问题处理的比较到位。...()接口足够稳定，支持跨平台使用; 我们可以使用轻量级库轻松封装事件委托模式; 随着JavaScript的发展，JQuery提供的语法糖显得越来越鸡肋。...我们之所以选择 Flow 是因为当时@flow weak 弱类型等功能使我们能够逐步有效地开始将类型应用到没有类型的代码库中。...在某些情况下，我们能够完全删除某些遗留代码，而不必在 vanilla JS 中重写它们。 这几年来，通过以上所述和诸如此类的努力，我们逐渐减少了对 jQuery 的依赖，直到不再有一行代码引用它。...我们仅在绝对必要时提供这些补丁，也就是说，它们只作为单独的 JavaScript 包提供给那些过时的浏览器使用以弥补兼容性的不足。
在宏观维度(“如何向用户交付一个解决方案”)、中等维度(“如何快速有效的排序数据”)，或微观维度(“怎么遍历数组”)上，都在纠结这个。...这在当下看起来滑稽可笑，但在当时确是个大事情。传统上，当需要做点什么时，都需要网站刷新才行。JS提供了一些玩具功能，但标准网站很大程度上还是基于页面的。...jQuery 的创建者 John Resig 在谈到该框架的起源时说： 当开始创建这个库的时候，我想解决自己的两个痛点: 1) 提供简单的DOM接口； 2) 减少开发过程中的跨浏览器问题[2] 处理跨多个浏览器的...Nelson 说：“数年来我在尝试用 jQuery 和纯 JS 搭建好用的单页应用的过程中屡战屡败，直到我偶然发现了 AngularJS，它教会了我应用模型不用纠结在 DOM 中。...的答案就是：取决于具体的需求，用 jQuery 或 Vanilla JS 都可以。 Vanilla JS 可不是一个框架，也不是一个库，其实什么也不是，就是 JavaScript。
1、正确引用jQuery 尽量在body结束前才引入jQuery，而不是在head中。 借助第三方提供的CDN来引入jQuery，同时注意当使用第三方CDN出现问题时，要引入本地的jQuery文件。...在整个DOM中查找class为home的a元素，性能可想而知。...时，它将遍历整个DOM，jQuery方法还具有一个未充分利用的参数，既可以将一个上下文参数传入jQuery，以限制它只搜索DOM中特定的一部分。...与javascript一样，一般来说,最好确保你的变量在函数作用域内。...如在减少代码段中，如果需要根据条件从数组中得到新数组时，可以使用$.grep() 方法，如果你在使用jQuery时有自己心得的话，欢迎在留言中和大家分享！
而 JQuery 开发者可以使用 CSS 选择器和函数可以轻松地遍历和操作 DOM， 此外，JQuery 还提供了一些开箱即用的函数来做动画 DOM 元素，而无需弄乱 CSS。...JQuery 提供了一个可以在大多数浏览器上工作的 API，这在当时使用 JavaScript 是很难实现的。...但在过去的几年里，JavaScript 已经成熟了很多，它支持很多新的 API，其社区也构建了很多库来填补 jQuery 可能留下的任何空白。...现在，开发者几乎可以在原生 JavaScript 中做任何 jQuery 可以做的事情。...jQuery 在这个场景下仍然很流行，因为它既简单又有效，人们觉得没必要停止使用它。”jQuery 开发者 Micha Gobiowski-Owczarek 在接受外媒采访时说道。
语言特点快速获取文档元素提供漂亮的页面动态效果创建AJAX无刷新网页提供对JavaScript语言的增强增强的事件处理更改网页内容jQuery的由来2005年8月，John Resig提议改进Prototype...在构造jQuery对象模块中，如果在调用构造函数jQuery()创建jQuery对象时传入了选择器表达式，则会调用选择器Sizzle（一款纯JavaScript实现的CSS选择器引擎，用于查找与选择器表达式匹配的元素集合...在功能模块中，事件系统提供了统一的事件绑定、响应、手动触发和移除机制，它并没有将事件直接绑定到DOM元素上，而是基于数据缓存模块来管理事件；Ajax模块允许从服务器上加载数据，而不用刷新页面，它基于异步队列模块来管理和触发回调函数...；动画模块用于向网页中添加动画效果，它基于队列模块来管理和执行动画函数；属性操作模块用于对HTML属性和DOM属性进行读取、设置和移除操作；DOM遍历模块用于在DoM树中遍历父元素、子元素和兄弟元素；DOM...该团队继续提供维护版本和支持，但在测试和支持如此庞大的社区的负担下，进展继续放缓。
二、jQuery对象和DOM对象 2.1、DOM对象 使用JavaScript中的DOM API操作获得的元素对象叫DOM对象。...无论选择器匹配了多个或者零个元素，jQuery对象都不再是null。意味着你只能够用jQuery对象的.length属性来判断选择器是否选中了元素。 获得jQuery对象的示例： DOM转换成jQuery对象 要使用jQuery中的方法与属性就需要把一个JavaScript中的DOM对象转换成jQuery对象。...DOM对象； $只是jQuery的别名形式； 每一个jQuery对象都是一个DOM对象的集合 三、常用选择器 通过jQuery中的选择器实际上取得的是HTML中的DOM元素。...有了jQuery，就能够利用现有知识去发挥选择器的威力，在很大程度上简化JavaScript代码。CSS中可以使用的选择器基本都可以用到jQuery中，反之不然。 3.1.
但是我们可以使用jQuery提供方法，将DOM对象通过jQuery()函数包装成为jQuery对象，同样我们可以把jQuery对象转化成DOM对象。...jQuery--->DOM对象：$jQuery对象[0]或者$jQuery对象.get(0); DOM对象--->jQuery：$(DOM对象) 2.jQuery九种选择器 选择器是jQuery 的根基..., 在 jQuery 中, 对事件处理, 遍历 DOM 和 Ajax 操作都依赖于选择器 jQuery(expression, [context]) 在核心函数jQuery中传入表达式，对页面中元素进行选择...在jQuery 1.3中，上下的padding和margin也会有动画，效果更流畅。...解析中 find 方法使用最多 对查找结果进行遍历操作 each(function(){… }) ，在each函数中可以通过this 获得DOM对象，$(this) 获得jQuery对象 ②：属性操作
介绍 MooTools是一个简洁，模块化，面向对象的开源JavaScript web应用框架。 它为web开发者提供了一个跨浏览器js解决方案。在处理js、css、html时候。...它提供了一个比普通js更面向对象的documentAPI。 ?...对于DOM的扩展增强，使开发者更好的利用document 如果是有着成百上千页面的大项目，有些大数据量交互与处理的项目，多人合作，多模块化的项目，jQuery往往就显得底气不足，往往需要各类插件补充..."> 如何使用 MooTools 选择器 DOM元素选择器 //由类获取元素 $$('.foo'); // or even: document.getElements('.foo'...'null' - (string) 如果对象为 undefined, null, NaN 或其它。
一、 jQuery和Vue的区别 jQuery 轻量级Javascript库 Vue 渐进式Javascript-MVVM框架 jQuery和Vue的对比 jQuery使用了选择器（$函数）选取DOM对象...在Vue中，对数据进行操作不再需要引用相应的DOM对象，可以说数据和View是分离的。...再说一些Vue相比jQuery而言所具有的优势 组件化开发，提高代码的复用 数据和视图分离，便于维护和操作 虚拟DOM，在无需关心DOM操作的基础上，依然提供了可靠的性能 二、 模拟jQuery的选择器...= window.$ = jQuery; } })(); 最简单的方法 仅仅对于IE8及以上有效 (function(){ var jQuery = function(selector){...()返回的是DOM原生element对象 而jQuery的选择器返回的是jQuery的包装对象，同时包含了原生DOM对象和一些jQuery的构造函数所具有的属性 稍微复杂一点的实现方法 (function
AngularJs是不直接操作DOM的，但是在平时的开发当中，我们有的时候还是需要操作一些DOM的，如果使用原生的JS的话操作过于麻烦，所以大家一般都是使用jQuery，jQuery虽然好用，但是AngularJs...是不建议和JQuery同时使用的，所以AngularJs给我们也提供了一些操作DOM的方法———Jqlite 查阅官方提供的api，可以看到使用方法是angular.element(ele)...data()-在匹配元素上存储任意相关数据 detach()-从DOM中去掉所有匹配的元素 empty()-从DOM中移除集合中匹配元素的所有子节点 eq()-减少匹配元素的集合为指定的索引的哪一个元素...如果提供一个选择器，那么只有紧跟着的兄弟元素满足选择器时，才会返回此元素 on() - 在选定的元素上绑定一个或多个事件处理函数 off() - 移除一个事件处理函数 one() - 为元素的事件添加处理函数...处理函数在每个元素上每种事件类型最多执行一次 parent() - 取得匹配元素集合中，每个元素的父元素，可以提供一个可选的选择器 prepend()-将参数内容插入到每个匹配元素的前面（元素内部） prop
jQuery 凭借简洁的语法和跨平台的兼容性，极大地简化了JavaScript 开发人员遍历 HTML 文档、操作 DOM、处理事件、执行动画和开发 Ajax 的操作。... 过滤选择器主要是通过特定的规则筛选出 DOM 元素，过滤规则与 CSS 中的伪类选择器语法相同，即选择器都以一个 : 开头。...(object, [callback]); // jquery 3.0 版本之后提供的方式 for(元素对象 of 容器对象){} 1.6 事件 1.6.1 DOM 加载 (document).ready...而通过 jQuery 中的 (document).ready() 方法注册的事件处理程序，在 DOM 完全就绪时就可以被调用。...例如与图片有关的 HTML 下载完毕，并且已经解析为 DOM 树了，但很有可能图片还未加载完毕，所以例如图片的高度和宽度这样的属性此时不一定有效。
就是说它非常请求，大小在30kb左右；具有强大的选择器和dom操作的封装，可靠的事件处理机制，有完善的ajax，jquery将所有的ajax操作封装到函数``$.ajax()`中；具有丰富的插件，完善的文档...入口函数如下 window.onload = function(){ // 执行代码 } JavaScript的入口函数与jquery入口函数： jquery的入口函数是在HTML所有标签都加载后执行..."div:first") 匹配所有div中第一个div元素 后代选择器 $("ancestor descendant") 匹配给定的祖先元素的所有后代元素 $("#ul li") 匹配 id 为null...Jquery中的dom操作。 dom是document object model的缩写。文档对象模型。...dom是一种与浏览器，平台，语言无关的接口，jquery中的dom操作就是对HTML中的元素进行操作。
与javascript一样，一般来说,最好确保你的变量在函数作用域内。...在之前的版本中 on() 就是 bind()。自从jQuery 1.7版本 后，on() 附加事件处理程序的首选方法。然而，出于一致性考虑，你可以简单的全部使用 on()方法。...（使用谷歌CDN请自行搜索地址，此处地址以不能使用，推荐jquery官网提供的CDN）。...必要时组合jQuery和javascript原生代码 如上所述，jQuery就是javascript，这意味着用jQuery能做的事情，同样可以用原生代码来做。...DOM操作？ajax？模版？css动画？还是选择符引擎？或许javascript微型框架或jQuery的定制版是更好的选择。
我最近从我的博客中移除了 jQuery，并发现自己不断地在谷歌上搜索一些模式。...为了节省大家的时间，我编写了这个实用的参考指南，列出了一些最常见的 jQuery 模式及其在 JavaScript 中的等价物。我们将涵盖如何从这些概念和函数迁移到纯 JavaScript。...在 JavaScript 中，$() 或 jQuery() 的等价物是 querySelector() 或 querySelectorAll()，它们同样可以使用 CSS 选择器。...DOM 完全加载后执行操作 */ }); 切换元素类名 通过 classList 属性，您可以方便地在 JavaScript 中添加、删除或切换类名。...中添加元素 本文译自：https://tobiasahlin.com/blog/move-from-jquery-to-vanilla-javascript/
实际上，jQuery对象比这更复杂。 链接DOM和DOM元素 文档对象模型（简称DOM）是HTML文档的表示形式。它可能包含任意数量的DOM元素。在高层次上，DOM元素可以被认为是网页的“一块”。...元素具有任何JavaScript对象的属性。这些属性中的属性.tagName和方法类似.appendChild()。这些属性是通过JavaScript与网页进行交互的唯一方法。..."; 这在许多情况下起作用，但在大多数版本的Internet Explorer中都会失败。在这种情况下，推荐的方法是使用纯DOM方法。...链接获取元素到jQuery对象 当使用CSS选择器调用jQuery函数时，它将返回一个包含与此选择器匹配的元素的jQuery对象。...因为firstHeading是一个jQuery对象，它有一些有用的方法，如.html()和.after()。jQuery还有一个命名方法.get()提供了一个相关的功能。
前言 通过问题看本质： 举例： js的写法:document.getElementById('save').disabled=true; 在jquery中我是这样写的 $("#save").disabled...1.2 JavaScript对象 JavaScript 提供多个内建对象，比如 String、Date、Array 等等。 对象只是带有属性和方法的特殊数据类型。...对象 DOM对象，即是我们用传统的方法(javascript)获得的对象，jQuery对象即是用 jQuery类库的选择器获得的对象。...; 注意：在jQuery对象中无法使用DOM对象的任何方法。...三、总结一下 dom对象才能使用dom中的方法，jquery对象不可以使用dom中的方法，但 jquery对象提供 了一套更加完善的工具用于操作dom。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
腾讯会议
云直播
对象存储
