-
실습 - innerText, innerHTML 프러퍼티JavaScript/실습 2023. 1. 28. 16:16
innerText 버튼을 클릭했을때 innerHTML 버튼을 클릭했을 때 나의풀이
<!DOCTYPE html> <html lang="en"> <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"> <title>Document</title> <style> </style> </head> <body> <div id="btns"> <button type="button" onclick="original()">innerText로 표시하기</button> <button type="button" onclick="italic()">innerHTML로 표시하기</button> </div> <br> <div id="time"> <h1>현재시각:</h1> <br> </div> <script> var now = new Date(); // 현재 날짜 및 시간 document.querySelector('#time').innerText += now; function italic(){ document.getElementById('time').style.fontStyle = "italic"; } function original(){ document.getElementById('time').style.fontStyle = "normal"; } </script> </body> </html>해설풀이
<!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>innerText, innerHTML 프로퍼티</title> </head> <body> <button onclick="inntext()">innerText로 표시하기</button> <button onclick="innhtml()">innerHTML로 표시하기</button> <h1>현재 시각: </h1> <div id="current"></div> <script> var now = new Date(); function inntext(){ document.getElementById("current").innerText = now; } function innhtml() { document.getElementById("current").innerHTML = "<em>" + now + "</em>"; } </script> </body> </html>'JavaScript > 실습' 카테고리의 다른 글
실습 - 이미지 클릭하면은, 이벤트 유형 & 위치 나타내기 (0) 2023.01.29 실습 - 이미지를 클릭하면은 색깔 바꾸기 (0) 2023.01.29 실습 - 클릭하고 창 닫기 (0) 2023.01.26 실습 - 책읽기 날짜 프로그램 만들기 (0) 2023.01.24 실습 - 클릭하면은 상세설명 나타내고, 클릭하면은 상세설명 닫기 (0) 2023.01.24
