Home > Web Front-end > JS Tutorial > body text

Why still use jQuery now? Reason analysis

青灯夜游
Release: 2023-04-14 15:15:51
forward
2132 people have browsed it

Why still use jQuery now? Reason analysis

According to statistics, jQuery global website usage is still high. But it is an indisputable fact that with the modernization of Web technology, jQuery has been marginalized, and many people directly believe that jQuery is outdated and do not need to consider using it anymore. These people may rarely use jQuery, or may not use it. Even if they do not use jQuery, there is still room for discussion.

First of all, jQuery has indeed lost its former advantage in developing modern front-end UI. As Web standards mature, there is no need to consider too much compatibility and consistency, and DOM operation APIs have also been replaced; in addition, new ones have emerged. Technology markets (such as MVVM) can declaratively automate the development of UI functions.

In fact, many factors need to be considered whether to learn to use a tool (to use it in a new project). As far as jQuery goes, I think there's still a place for learning and using it.

Use

When choosing a technology stack for a commercial project, both input cost and return ratio should be considered. People who oppose the use of jQuery are generally worried that it will become outdated and will not be used after learning it, and they also doubt its development efficiency. Any technology will become obsolete, so in predictable projects, whether the technology is obsolete is not the primary factor to consider. The primary consideration is the cost of learning, development and maintenance, and the rate of return.

Every tool has a learning cost and its applicability in use. The learning cost of native DOM and React is not low, and it also has its unique scope of application.

  • As a standard, the native DOM API must be universal. DOM operations are relatively primitive.
  • MVVM is actually only applicable to the UI of status update, and is not applicable to some subtleties. DOM operations, such as animation and window operations

In fact, jQuery is a tool library for DOM operations. Your native or React project must have some customized tool libraries to improve development efficiency. Because native operations are so primitive, React's abstractions are not suitable for all interactive functionality needs.

Whether to use jQuery or not depends on the nature of the project and the specific development tasks. For now, for some small and medium-sized projects with few data interaction functions, the return on investment ratio of using jQuery should be good.

Learning

In addition to the perspective of usage, from the perspective of learning, my point of view is that studying jQuery usage and source code is still useful for improving JS level and front-end level. help.

Atypic believes that six reasons why we still use jQurey

The following is a brief translation of the several reasons for using jQuery summarized by the Atypic team

First, jQurey's DOM node selector is more powerful than the native one

Now the native querySelector also uses CSS selectors, but jQurey is more "advanced" above the CSS standard . The so-called advanced refers to a certain node query task that is more direct and convenient. These partial selector syntaxes are not included in the CSS standard. For example: Pseudo class :visible:

$('a[href^="http://"]:visible')
Copy after login

This query selects all a# whose prefix is ​​the unsafe protocol name http:// and is visible ##Label.

If you have a large number of such advanced queries, the native query cannot satisfy it (a large number of primitive operations must be written). Without jQuery, you have to encapsulate it yourself.

第二,jQurey 支持链式语法,可将多个DOM操作写成一句

jQurey构造函数($())创建并返回一个 jquery对象,这个对象实例的所有 DOM 操作方法 都会修改当前实例后返回它(新的修改过后jquery实例)注1,这样,多个 DOM操作 就可以连写在一起,这就是有名的 链式语法。例如

$('a[href^="http://"]').addClass(‘insecure').attr('target', '_blank');
Copy after login

以上语句 选中的DOM节点 执行了两次操作:添加样式类(insecure)和属性(target)。如果用原生 得这么写:

 const insecure_links = document.querySelector(‘a[href^=“http://“]’);
  insecure_links.classList.add(‘insecure’);
  insecure_links.addAttribute(’target’, ‘_blank’);
Copy after login

这里比较明显的看出jQuery的优势。

第三,jQurey支持自动批量处理节点数组,语法更简洁

jQuery对象的DOM操作方法默认是批量处理,无论是你选一个或是多个;但是如果是 多个,原生必须使用 querySelectorAll,并且选中后还要手动循环处理每个节点:

  const insecure_links = document.querySelectorAll(‘a[href^=http://“]’);
  for (let i = 0; i < insecure_links.length; i++) {
      insecure_links[i].classList.add(‘insecure’);
      insecure_links[i].addAttribute(’target’, ‘_blank’);
  }
Copy after login

无论是一个 还是多个,jQuery 都是一条语句(没变化):

$('a[href^="http://"]').addClass('insecure').attr('target', '_blank');
Copy after login

jQuery 一个中间变量都不用,代码简洁易读,这就是效率。

第四,浏览器无关

现代浏览器普及率已经相当不错,但不绝对,且如果你有老项目需要维护,目前还是有学用jQuery的必要。如果你想用最新技术,又不得不维护兼容性,则得自己处理兼容问题,这可能不比直接使用 jQuery 更有效率。尤其是 AJAX 和 事件检测 这两个 兼容问题。

第五,丰富的插件库

大家都很喜欢 jQuery的一个点,是它有很多 非常有用 的插件。这些插件 不但多样,且成熟。一个典型例子就 是轮播插件(carousel)。不使用插件,要我们自己写一个,我们得花一到两个工作日,轮播展示功能 很复杂。

使用jQuery,则有多种 轮播插件可选择,灵活且成熟,可满足任何 轮播展示的需求。

小结

以上理由都为了——开发者效率,而效率要靠专注,需要抽象来维护一个较小的工作环境,忽略不必要的细节。jQuery 的抽象 是有效率的。

不过,就是因jQuery是有抽象的,也作为一种依赖是有大小的,所以,会有性能(运行和加载)损耗。这些都是 项目成功 的可能因素 。

原文地址:https://nakeman.cn/blog/reasons-why-we-still-use-jquery/%EF%BC%89

更多编程相关知识,请访问:编程教学!!

The above is the detailed content of Why still use jQuery now? Reason analysis. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:juejin.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact [email protected]
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!