728x90
onclick
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>JavaScript Output</title>
</head>
<body>
<h1>HTML DOM 요소를 이용한 innerHTML 프로퍼티</h1>
<p id="text">이 문장을 바꿀 것입니다!</p>
<button onclick="a()">버튼</button>
<script>
function a() {
var str = document.getElementById("text");
str.innerHTML = "이 문장으로 바뀌었!";
}
</script>
</body>
</html>
제이쿼리를 이용해 id값으로 클릭
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>JavaScript Output</title>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
</head>
<body>
<h1>HTML DOM 요소를 이용한 innerHTML 프로퍼티</h1>
<p id="text">이 문장을 바꿀 것입니다!</p>
<button id="a">버튼</button>
<script>
var str = document.getElementById("text");
$('#a').click(function(){
str.innerHTML = "이 문장으로 바뀌었!";
});
</script>
</body>
</html>
자바스크립트로 html상 날짜 가져오기
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>JavaScript Apply</title>
<script>
function printDate() {
document.getElementById("date").innerHTML = Date();
}
</script>
</head>
<body>
<h1>head 태그 내의 자바스크립트</h1>
<p>자바스크립트를 이용하면 현재 날짜와 시간 정보에도 손쉽게 접근할 수 있어요!</p>
<button onclick="printDate()">현재 날짜와 시간 표시하기!</button>
<p id="date"></p>
</body>
</html>
var date1 = new Date(); // 현재 날짜 및 시간
var date2 = new Date(1991,11,25,3,50); // 1991년 12월 25일 3:50:00 (월 +1 주의)
var date3 = new Date('2014-6-4'); // 2002년 1월 1일 09:00:00
var date4 = new Date('2012-05-17 10:20:30'); // 2012년 5월 17일 10:20:30
innerText, innerHTML
innerText는 태그안의 text만 가져오고
innerHTML은 태그까지 전부다 가져온다.
https://hianna.tistory.com/480
innerText는 텍스트를 입력할 수있고 (글자만 출력)
innerHTML은 속성까지 입력이 가능하다. (css나 스크립트까지)
위의 링크에 들어가서 두번째 예시ㄱㄱ
innerContent, innerText, innerHTML 차이
innerHTML은 태그까지 전부다 가져오고
innerText는 화면에 출력되는 텍스트값만 가져오고
innerContent는 화면에 숨겨진 텍스트까지 가져온다.
https://hianna.tistory.com/483?category=764998
728x90