비전공자 개발일기

JQuery 1 - 기본 문법 본문

JQuery

JQuery 1 - 기본 문법

HiroDaegu 2021. 12. 1. 21:05
728x90
SMALL
<!DOCTYPE html>
<html lang="ko">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <title>JQuery 기본 문법</title>
    <script>
        $(function() {
            $("p").on("click", function(){
                $("p").css("color", "#00f");
            });
        });
    </script>
    <style>
        * {
            text-align: left;
        }

        pre{
            font-size: 20px;
            font-weight: 700;
        }
    </style>
</head>

<body>
    <p>제이쿼리 시작!</p>
    <p>마우스 클릭!</p>
    <p>JQuery: 오픈 소스 기반의 자바스크립트 라이브러리</p>
    <pre style="border: 1px solid;">
        제이쿼리의 기본 문법
        ㄴ$(선택자).동작함수();

        「window.onload = function() { 자바스크립트 코드; };」
        = 「$(document).ready(function() {제이쿼리 코드;});」
        = 「$(function() {제이쿼리 코드;});」

    </pre>
</body>

</html>
728x90
LIST

'JQuery' 카테고리의 다른 글

JQuery6  (0) 2021.12.06
JQuery5  (0) 2021.12.05
JQuery4  (0) 2021.12.04
JQuery3  (0) 2021.12.03
JQuery2  (0) 2021.12.02
'JQuery' Related Articles more