제이쿼리를 사용하는 이유-JS 튜토리얼-php.cn

제이쿼리를 사용하는 이유

coldplay.xixi

풀어 주다： 2020-11-16 10:53:13

원래의

3391명이 탐색했습니다.

jquery를 사용하는 이유: 1. CSS 선택자를 기반으로 DOM 요소를 빠르게 얻을 수 있습니다. 2. 또한 DOM 요소의 CSS 스타일을 수정할 때 프로그래밍 형식이 스타일 태그와 유사하여 기억하기 쉽습니다.

제이쿼리를 사용하는 이유

추천: "jquery 비디오 튜토리얼"

1. jQuery란 무엇입니까

jQuery는 JavaScript를 사용하여 웹 페이지 특수 효과를 개발할 때 발생하는 복잡성 중 일부를 단순화하고 다음을 제공하는 JavaScript 라이브러리 세트입니다. 일반적인 작업을 자동화하고 복잡한 작업을 단순화합니다. jQuery를 사용하면 원래 많은 JavaScript 코드가 필요한 기능을 몇 줄의 코드로 줄일 수 있을 뿐만 아니라 충분히 빠른 성능을 제공할 수 있습니다.

2. jQuery를 사용하는 이유

예를 들어, 이제 다음과 같은 기본 웹 페이지가 있다고 가정해 보겠습니다.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        div{
            width: 100px;
            height: 100px;
            border: 1px solid #000000;
        }
    </style>
</head>
<body>
<div></div>
<div></div>
<div id="box2"></div>
</body>
</html>

로그인 후 복사

그런 다음 기본 JavaScript와 jQuery를 사용하여 위 세 div의 배경색을 변경합니다.

<script>
        //使用原生JavaScript改变背景颜色
        window.onload = function (ev) {
            var div1 = document.getElementsByTagName("div")[0];
            var div2 = document.getElementsByClassName("box1")[0];
            var div3 = document.getElementById("box2");
            // console.log(div1);
            // console.log(div2);
            // console.log(div3);
            div1.style.backgroundColor = "red";
            div2.style.backgroundColor = "yellow";
            div3.style.backgroundColor = "blue";
        }
 
        //使用jQuery改变背景颜色
        // $(function () {
        //     var $div1 = $("div")[0];
        //     var $div2 = $(".box1")[0];
        //     var $div3 = $("#box2")[0];
        //     // console.log($div1);
        //     // console.log($div2);
        //     // console.log($div3);
        //     $div1.css({
        //         background: "red"
        //     });
        //     $div2.css({
        //         background: "yellow"
        //     });
        //     $div3.css({
        //         background: "blue"
        //     });
        // })
    </script>

로그인 후 복사

두 가지 방법을 비교해 보면 jQuery 사용의 가장 직접적인 이점은 CSS 선택기를 기반으로 DOM 요소를 빠르게 얻을 수 있다는 점입니다. 또한 DOM 요소의 CSS 스타일을 수정할 때 프로그래밍 형식이 스타일 태그와 유사하여 기억하기 쉽습니다. 물론 jQuery를 사용하면 다른 이점도 있는데, 이는 이후 연구에서 계속해서 발견하고 탐구할 것입니다.