Home > Article > Web Front-end > Detailed graphic explanation of the difference between JavaScript and jQuery
Detailed graphic explanation of the difference between JavaScript and jQuery
- yuliaOriginal
- 2018-10-30 17:13:343600browse
JavaScript is an indispensable part of front-end development. jQuery is also widely used because it is easy and fast to use. Both can achieve the effect of the page. Do you know the difference between JavaScript and jQuery? This article will tell you about the difference between JavaScript and jQuery. Interested friends can refer to it.
1. The essential difference
JavaScript is an interpreted scripting language. This language can be used for HTML and web, and can be widely used on servers and PCs. , laptops, tablets, and smartphones.
JQuery is a function library of JavaScript, which can also be said to be a framework of JavaScript.
JavaScript code is written directly in the tag
jQuery code is also written in tag, but the jQuery library must be introduced before the HTML code. As shown in the figure below:
2. Grammatical differences
JavaScript and jQuery operate element nodes, attribute nodes, and text Nodes, click events, etc. are all different. Let’s take the operation of element nodes as an example to see how they are different.
Example 1: Get tag elements based on ID name
Description:
Create two p tags in the page and give them a class class name and ID name. It is convenient to obtain it with JavaScript and jQuery later.
Use JavaScript and jQuery to get the element with ID first. The specific code is as follows:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<p class="pp" id="first">1</p>
<p class="pp">2</p>
</body>
<script type="text/javascript">
var first = $("#first");
var first = document.getElementById("first");
</script>
</html>Example 2: Get the tag element based on class
var pp = $(".pp");//返回的是一个jQuery对象，通过pp[i]能取到具体元素
var pp = document.getElementsByClassName("pp");//返回的是元素列表，通过pp[i]能取到具体元素Example 3: Get the tag element based on the tag name
var p = $("p");//返回的是一个jQuery对象，通过p[i]能取到具体元素
var p = document.getElementsByTagName("p");//返回的是元素列表，通过p[i]能取到具体元素There are many differences in syntax between JavaScript and jQuery. I won’t do too many demonstrations here for those who don’t know. You can refer to the effect articles on the PHP Chinese website, or visit JavaScript Video Tutorial.
Summary of the difference between JavaScript and jQuery:
1. Without javascript, there would be no jquery. They are a father-son relationship.
2. jquery is a reference to javascript. A kind of encapsulation, jQuery is more concise than JavaScript
3. jquery is a script that is simpler to use with javascript. When writing scripts, javascript and jquery syntax are basically compatible
The above introduces the difference between JavaScript and jQuery , hope it helps you!
For more related tutorials, please visit JavaScript Chinese Reference Manual
The above is the detailed content of Detailed graphic explanation of the difference between JavaScript and jQuery. For more information, please follow other related articles on the PHP Chinese website!