Home > Article > Web Front-end > What are the differences between jquery and javascript?

What are the differences between jquery and javascript?

coldplay.xixiOriginal: 2021-04-09 14:30:366284browse

The difference between jquery and javascript: 1. js is inserted into the HTML page through the [3f1c4e4b6b16bbbd69b2ee476dc4f83a] tag, while JQuery is a JavaScript function library; 2. js uses the getElement series, while JQuery uses [$()] Package selector.

The operating environment of this tutorial: Windows 7 system, JavaScript version 1.8.5, DELL G3 computer.

The difference between jquery and javascript:

1. The essential difference

1.JavaScript passesf7d3dee7b813f5dfc707116db3ce50ef tag is inserted into HTML pages, a lightweight programming language that can be executed by all modern browsers.

2.JQuery is a JavaScript function library. In other words, it is the most popular framework in JavaScript.

To use JQuery, you must first add a reference to the jQuery library at the beginning of the HTML code, for example:

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

The library file can be placed locally, or you can directly use the CDN of a well-known company. Advantages The CDNs of these large companies are more popular. Before users visit your website, it is likely that it has been cached in the browser when visiting other websites, so it can speed up the opening speed of the website. Another benefit is obvious, saving website traffic bandwidth. For example:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script>　　//Google

or:

<script src="http://code.jquery.com/jquery-1.6.min.js"></script> 　　//jQuery 官方

2. Syntax differences

Operation element node

a. JavaScript uses

getElement series, query series

<body>
    <ul>
        <li id="first">哈哈</li>
        <li class="cls" name ="na">啦啦</li>
        <li class="cls">呵呵</li>
        <li name ="na">嘿嘿</li>
    </ul>
    <div id="div">
        <ul>
            <li class="cls">呵呵</li>
            <li>嘿嘿</li>
        </ul>
    </div>
</body>
<script>
　　document.getElementById("first");　　　　　　　　//是一个元素
　　document.getElementsByClassName("cls");　　　　//是一个数组，即使只有一个元素，使用时需要用[0]取到第一个再使用
　　document.getElementsByName("na");　　　　　　　//是一个数组，即使只有一个元素，使用时需要用[0]取到第一个再使用
　　document.getElementsByTagName("li");　　　　　//是一个数组，即使只有一个元素，使用时需要用[0]取到第一个再使用
　　document.querySelector("#div");　　　　　　　　//是一个元素 
　　document.querySelectorAll("#div li");　　　　//是一个数组，即使只有一个元素，使用时需要用[0]取到第一个再使用
</script>

b.JQuery uses

a large number of selectors and uses $() to wrap the selection Device

<body>
    <ul>
        <li id="first">哈哈</li>
        <li class="cls" name ="na">啦啦</li>
        <li class="cls">呵呵</li>
        <li name ="na">嘿嘿</li>
    </ul>
    <div id="div">
        <ul>
            <li class="cls">呵呵</li>
            <li>嘿嘿</li>
        </ul>
    </div>
</body>
<script src="http://code.jquery.com/jquery-1.6.min.js"></script>
<script>
　　//使用JQuery取到的是jquery对象都是一个数组，即使只有一个元素被选中,但是在使用时候不一定需要使用:eq(0)来拿到这一个在使用可以直接使用
    $("#first");　　　　　　　　　　　　
    $(".cls");
    $("li type[name=&#39;na&#39;]");
    $("li");
    $("#div");
    $("#div li");
</script>

Related free learning recommendations: javascript learning tutorial

The above is the detailed content of What are the differences between jquery and javascript?. For more information, please follow other related articles on the PHP Chinese website!

Statement：

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 admin@php.cn

Previous article：How to replace regular expressions in javascriptNext article：How to replace regular expressions in javascript

See more

What are the differences between jquery and javascript?

Related articles