728x90
자바스크립트 코드로 동적으로 태그를 추가하는 예제이다.
|
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script defer src="./main.js"></script>
</head>
<body>
<h1>Hello world!</h1>
<ul></ul>
</body>
</html>
|
main.js
|
<script>
// for(시작조건;종료조건;변화조건) {}
const ulEl = document.querySelector('ul')
for(let i =0 ; i < 3; i++){
const li = document.createElement('li')
li.textContent = `list-${i+1}`
li.addEventListener('click', function () {
console.log(li.textContent)
})
ulEl.appendChild(li)
}
</script>
|
728x90
'Web 프로그램 > js, jQuery' 카테고리의 다른 글
| 카카오지도 Uncaught SyntaxError: Identifier 'marker' has already been declared (3) | 2024.03.01 |
|---|---|
| Triggering create on injected HTML (0) | 2021.10.01 |
| jQuery 사용자 정의 메소드 만들기 ($.fn.메소드명) (0) | 2021.09.17 |
| jQuery + PHP 오름차순/내림차순 정렬 처리 (0) | 2021.07.25 |
| [Javascript] 단축 평가 (short-circuit evaluation) 논리 계산법 (0) | 2021.06.13 |
Link2Me
