JavaScript

[DOM] JS - HTML - 내용입력/내용변경/속성값변경(=속성값입력)

목차
  1. HTML 요소에 내용입력 (=  출력흐름 변경 가능)
  2. HTML 요소의 내용변경
  3. HTML 요소의 속성값변경 (= 속성값입력)

 

HTML 요소에 내용입력 (=  출력흐름 변경 가능)

 

<!DOCTYPE html>

<html>

<body>

<h1>홈짱닷컴</h1>

<script>

document.write(Date());

</script>

<p>Homzzang.com</p>

</body>

</html> 

 

결과보기

※ 새로고침할 때마다 현재시간으로 바뀜.

※ 문서 로드 완료 후 document.write() 사용하면, 페이지 내용 바뀌니 주의 !!

 

HTML 요소의 내용변경

 

<h1 id="site">홈짱닷컴</h1>


<script>

var host = document.getElementById("site");

host.innerHTML = "Homzzang.com";

</script>

 

결과보기

 

HTML 요소의 속성값변경 (=속성값입력)

 

<img id="logo" src="hz.gif" width="160" height="120">


<script>

document.getElementById("logo").src = "homzzang.jpg";

</script>

 

결과보기



분류 제목
AJAX JS - AJAX (아작스) 소개
AJAX JS - AJAX - XMLHttpRequest() 메서드 ★ - 객체생성 (= 아작스/에이잭스 핵심 = X…
AJAX JS - AJAX - open()/send() 메서드 ★ - 서버에 요청 보내기 (GET방식 vs POST방…
AJAX JS - AJAX - Server Response (서버응답) - 콜백함수 사용 예제
AJAX JS - AJAX - XML 아작스 예제 (= xml 데이터 불러와 표만들기)
AJAX JS - AJAX - PHP 아작스 예제 ★ (= 입력제시어 = 입력예제)
AJAX JS - AJAX - ASP 아작스 예제 (= 입력제시어 = 입력예제)
AJAX JS - AJAX - DB 아작스 예제 ★ (= 데이터베이스 정보 가져오기) ※ select 태그 optio…
JSON JS - JSON - Introduction (소개)
JSON JS - JSON - Syntax (구문) ★
JSON JS - JSON - JSON vs XML (언어비교)
JSON JS - JSON - Data Types (데이터타입)
JSON JS - JSON - Object (객체)
JSON JS - JSON - Array (배열)
JSON JS - JSON - JSON.parse() 함수 ★ - (JSON문자열 → JS객체) 변환. (= 웹서버와…
6/89
목록
 홈  PC버전 로그인 일본어
그누앞단언어
그누뒷단언어
그외코딩언어
그누보드 1
제작의뢰
Q&A
커뮤니티 3
웹유틸
회원센터
홈짱닷컴 PC버전 로그인