T_era
[JavaScript] 기본문법 본문
JavaScript에 대해
- 사이트의 움직임을 주는 코드
- <head> 태그 안에 <script> 태그를 만들어 안에 작성
let : 변수를 위한 자료형
alert() : 팝업창
console.log(); : 로그 띄우는 함수
리스트와 딕셔너리
let num = [1, 2, 3]; : 리스트 작성
let person = {'name':'bob', 'age':30, 'height':180} : 딕셔너리 작성
let test = [
{ 'name': '영수', 'age': 30 },
{ 'name': '철수', 'age': 35 }
]
console.log(num[0]); : 리스트 내용 출력
console.log(person or person['name']); : 딕셔너리 내용 출력
console.log(test[0]['age']); 리스트-딕셔너리의 내용 출력
조건문
if(조건){
실행
}else{
실행
}
반복문
let num = [1, 2, 3, 4, 5];
num.foreach(element => {
console.log(element);
})
함수
funtion fun(){
내용
}
클릭 이벤트
<button onclick="fun()">fun함수에 해당하는 이벤트 실행</button>
원하는 태그에 이벤트를 부여하고 싶을 때
태그에 id=""를 부여하고
document.getElementBtId('id값')을 사용하여 이벤트 작성
또는 JQuery 라이브러리를 이용하여 사용
JQuery import 방법
<head> 태그 안에 아래코드 작성
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
JQuery 사용법
<script> 태그 안에 $('#id값')을 이용하면 된다.
변수에 태그를 포함한 내용 넣는법
let temp_html = `<p>내용</p>`;
- ``을 사용
태그안에 새로 내용 추가하기
$('#id').append(temp_html);
태그 문자열에 변수추가하기
let text = `<p>${변수}</p>`;
${변수명}을 추가하기
'Programing > Html' 카테고리의 다른 글
| [JavaScript] 앨범사이트에 JQuery 적용해보기 (0) | 2025.03.18 |
|---|---|
| [JavaScript] 기본문법 연습하기 (1) | 2025.03.18 |
| 이전에 배운 것을 사용해 사이트 만들어보기 (0) | 2025.03.18 |
| 부트 스트랩 (0) | 2025.03.18 |
| 앨범사이트 만들어보기 (0) | 2025.03.18 |
