[참고] http://www.w3schools.com/js/js_output.asp
자바스크립트는 어떠한 내장된 출력 및 표시 기능도 없다.
자바스크립트는 어떠한 내장된 출력 및 표시 기능도 없다.
자바스크립트 표시 방법들
자바스크립트는 다른 방식들로 데이터를 "표시" 할 수 있다.
- window.alert()를 사용하여 알림박스에 쓰는 법.
- document.write()를 사용하는 HTML 출력으로 쓰는 법.
- innerHTML를 사용하여 HTML요소로 쓰는 법
- console.log()를 사용하여 브라우저 콘솔로 쓰는 법.
window.alert() 사용하기
You can use an alert box to display data:.
Example
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html>
Try it Yourself »
document.write() 사용하기
테스트 목적으로 document.write()를 사용하는 것은 편리하다.
Example
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>
Try it Yourself »
HTML 문서가 완전히 로딩된 후에 document.write()를 사용한다면, 기존의 모든 HTML을 삭제할 것이다.
Example
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<button onclick="document.write(5 + 6)">Try it</button>
</body>
</html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<button onclick="document.write(5 + 6)">Try it</button>
</body>
</html>
Try it Yourself »
 | document.write() 메소드는 오직 테스팅으로만 사용하는게 낫다. |
|---|
innerHTML 사용하기
HTML 요소에 접근하기 위해 자바스크립트는 document.getElementById(id) method를 사용할 수 있다.
id 속성은 HTML 요소를 정의한다. innerHTML 속성은 HTML 내용을 정의한다.
Example
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My First Paragraph</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My First Paragraph</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>
Try it Yourself »
| (w3school) 예제들에서는, (HTML 요소 안에 표시하는)innterHTML 메소드를 주로 사용할 것이다. |
|---|
console.log() 사용하기
당신의 브라우저에서, 데이터를 표시하기 위해 console.log() 메소드르르 사용할 수 있다.
F12로 브라우저 콘솔을 활성화시키고, 메뉴에서 "Console"을 선택해라.
Example
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>
Try it Yourself »
댓글 없음:
댓글 쓰기