728x90
제이쿼리는 자바스크립트를 웹에서 좀 더 간편하게 사용할 수 있도록 합니다.
문법은 아주 간단합니다.
'$()'로 html 태그를 선택하고 '. 함수 이름'으로 제어합니다.
css로 스타일을 추가 변경하는 방법에 대해 알아보도록 하겠습니다.
1.cdn 추가하기.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
위의 코드를 head태그에 추가해주세요.
2. 함수 만들기.
function colorchange(){
$('p').css('color','red')
}
$로 p를 선택해 css속성을 추가하는 colorchange라는 이름의 함수를 만듭니다.
3. 완성 코드.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<p>000000000</p>
<button onclick="colorchange()">colorchange</button>
<script>
function colorchange(){
$('p').css('color','red')
}
</script>
</body>
</html>
버튼을 누르면 000000000이 빨간색으로 바뀝니다.
728x90
'기타 > jQuery' 카테고리의 다른 글
| [jQuery] 제이쿼리 appendTo, prependTo 사용해 요소 추가하기 (0) | 2021.02.08 |
|---|---|
| [jQuery] 제이쿼리 자식 요소 선택 by find(), children() (0) | 2021.02.07 |
| [jQuery] 제이쿼리 $ 의미 (0) | 2021.02.04 |
| [jQuery] 제이쿼리 선택자 여소 여러개 선택하기 (0) | 2021.02.03 |
| [jQuery] 제이쿼리 선택자 (0) | 2021.02.03 |
