current position:Home>[jQuery framework (3), what causes the CPU utilization of Java applications to soar

[jQuery framework (3), what causes the CPU utilization of Java applications to soar

2021-08-27 02:11:37 No hair loss Xiaoyi

jQuery The concept of

=============

jQuery It's a fast one 、 concise JavaScript frame , Is the Prototype And then another excellent one JavaScript The code base ( or JavaScript frame ).jQuery The purpose of the design yes “write Less,Do More”, That is to say, write less code , Do more . It encapsulates JavaScript Common function codes , Provides a simple JavaScript Design patterns , Optimize HTML The document operation 、 Event handling 、 Animation design and Ajax Interaction . It's used to simplify JS Development

And for JavaScript frame , In essence, they are some js file , Encapsulates the js The native code of .

jQuery Quick start

==============

1、 download jQuery


??? at present jQuery There are three major versions :

1.x edition : compatible ie678, The most widely used , At present, the government only does BUG maintain , No more features . So in general, for projects , Use 1.x The version will do , Final version :1.12.4 (2016 year 5 month 20 Japan )

2.x edition : Are not compatible ie678, Few people use , At present, the government only does BUG maintain , No more features . If you do not consider the compatibility of the lower version of the browser can use 2.x, Final version :2.2.4 (2016 year 5 month 20 Japan )

3.x edition : Are not compatible ie678, Only the latest browsers are supported . Unless otherwise required , Generally not used 3.x Version of , Many old jQuery The plug-in does not support this version . At present, this version is mainly updated and maintained by the official . The latest version can be found on the official website ,  Direct to the official website .

We are downloading and using jQuery You will find , There are usually two js file , One is to bring .min Of , The other is not carrying .min Of .

jquery-xxx.js And jquery-xxx.min.js difference :

1. jquery-xxx.js: Development version . For programmers , Well indented and annotated . It's bigger

2. jquery-xxx.min.js: Production version . Used in program , No indent . Smaller size . The program loads faster

So we usually import the second one when we use it jquery-xxx.min.js Production version of

2、 Import JQuery Of js file


Import min.js file

After the html The header of the file is imported to the js Link to file , As shown below :


<head>

    <meta charset="UTF-8">

    <title>jquery Quick start </title>

    <script src="js/jquery-3.3.1.min.js"></script>

</head>


     
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.

3、jQuery Use


We use jQuery When getting an element object , have access to “$()” As a selector , Get the content in the label body . Use... Respectively jQuery And don't use jQuery Get tag content , Make a practical comparison .


<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>jquery Quick start </title>

    <script src="js/jquery-3.3.1.min.js"></script>

</head>

<body>



    <div id="div1">div1...</div>

    <div id="div2">div2...</div>



    <script> // adopt jQuery Object to get the specified ID object  var div1 = $("#div1"); var div2 = $("#div2"); // adopt alert Output the result ( With jQuery Get the value in the form of ) alert(div1.html()); alert(div2.html()); /** *  Here's not to use jQuery Methods  * */ // Don't use jQuery Get specified ID object  var div3 = document.getElementById("div1"); var div4 = document.getElementById("div2"); // Don't use jQuery Get element content  alert(div3.innerHTML); alert(div4.innerHTML); </script>



</body>

</html>


     
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.
  • 58.
  • 59.
  • 60.
  • 61.
  • 62.
  • 63.
  • 64.
  • 65.
  • 66.
  • 67.

jQuery Objects and JS Object differentiation and transformation

======================

Compared with JS object ,jQuery Objects are more convenient to operate , The code is more concise

** But here's the thing :jQuery Objects and JS Object's method is not universal ,** So if we want to be in jQuery Use in js Method , Or in the js Use in jQuery How to do it ?

therefore , Let's share with you jQuery Objects and JS The transformation of objects

jQuery To js


Use jQuery object [ Indexes ] perhaps jQuery object .get( Indexes ) take jQuery Object to js object , You can use js Methods .

Detailed use of the following code :


<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>jquery and js The transformation of objects </title>

    <script src="js/jquery-3.3.1.min.js"></script>

</head>

<body>



    <div id="div1">div1...</div>

    <div id="div2">div2...</div>



    <script> /** * jQuery  To  js * */ //1、 adopt js It's called div All of the html Element object  var divs = document.getElementsByTagName("div"); alert(divs.length); // You can use it as an array  // Yes divs All in div Let its label body content become “aaa” for (var i = 0;i<divs.length;i++){ // divs[i].innerHTML = "aaa" $(divs[i]).html("ccc") // take js object divs[i] Turn into jQuery object  } </script>

</body>

</html>


     
  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.
  • 33.
  • 34.
  • 35.
  • 36.
  • 37.
  • 38.
  • 39.
  • 40.
  • 41.
  • 42.
  • 43.
  • 44.
  • 45.
  • 46.
  • 47.
  • 48.
  • 49.
  • 50.
  • 51.
  • 52.
  • 53.
  • 54.
  • 55.
  • 56.
  • 57.

js To jQuery


Use “ ” The parenthesis of the character contains j s object , Such as : ” The parenthesis of the character contains js object , Such as : (js object )

It can be used later jQuery The method of the ,

Detailed use of the following code :

Last

After all, I've been working for so long , Except for tuhu round , I also interviewed many big factories in July and August , Like Ali 、 Are you hungry 、 Meituan 、 Didi, these interview processes are not written in this article one by one . I will sort out a detailed interview process and some details of questions you want to know

Meituan interview experience

 Meituan interview
Experience in job interview
 It's a job interview
Rookie interview experience
 Rookie interview
Ant gold interview experience
 The ant gold dress
Vipshop interview experience
 Vipshop

Because of the limited space , The picture and text cannot be sent in detail , Interested friends   You can click here to go to my Tencent document Free access to the above information !

copyright notice
author[No hair loss Xiaoyi],Please bring the original link to reprint, thank you.
https://en.qdmana.com/2021/08/20210827021136165o.html

Random recommended