고정 헤더 영역
상세 컨텐츠
본문
https://www.w3schools.com/js/js_output.asp
JavaScript Output
W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.
www.w3schools.com
JavaScript Output_자바스크립트 출력 방법
JavaScript는 다양한 방식으로 데이터를 "표시"할 수 있습니다.
1. innerHTML을 사용하여 HTML 요소에 쓰기.
2. document.write()를 사용하여 HTML 출력에 쓰기.
3. window.alert()를 사용하여 경고 상자에 쓰기.
4. console.log()를 사용하여 브라우저 콘솔에 쓰기.
1.innerHTML 사용하기
HTML 요소에 액세스하기 위해 JavaScript는 document.getElementById(id) 메서드를 사용할 수 있습니다.
id 속성은 HTML 요소를 정의합니다. innerHTML 속성은 HTML 콘텐츠를 정의합니다.
[예제]
<!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 요소의 innerHTML 속성을 변경하는 것은 데이터를 HTML로 표시하는 일반적인 방법입니다.
2.document.write() 사용
테스트 목적으로 document.write()를 사용하는 것이 편리합니다.
[예제]
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>HTML 문서가 로드된 후 document.write()를 사용하면 기존 HTML이 모두 삭제됩니다.
[예제]
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<button type="button" onclick="document.write(5 + 6)">Try it</button>
</body>
</html>document.write() 메서드는 테스트용으로만 사용해야 합니다.
3. window.alert() 사용
경고 상자를 사용하여 데이터를 표시할 수 있습니다.
[예제]
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html>window 키워드를 생략 할 수 있습니다.
JavaScript에서 window 객체는 전역 범위 객체입니다.
즉, 변수, 속성 및 메서드는 기본적으로 창 개체에 속합니다.
이는 또한 window 키워드를 지정하는 것이 선택 사항임을 의미합니다.
[예제]
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
alert(5 + 6);
</script>
</body>
</html>
4.console.log() 사용
디버깅 목적으로 브라우저에서 console.log() 메서드를 호출하여 데이터를 표시할 수 있습니다.
이후 장에서 디버깅에 대해 자세히 알아볼 것입니다.
[예제]
<!DOCTYPE html>
<html>
<body>
<script>
console.log(5 + 6);
</script>
</body>
</html>자바스크립트 인쇄 JavaScript에는 인쇄 개체나 인쇄 메서드가 없습니다.
JavaScript에서 출력 장치에 액세스할 수 없습니다.
유일한 예외는 브라우저에서 window.print() 메서드를 호출하여 현재 창의 내용을 인쇄할 수 있다는 것입니다.
[예제]
<!DOCTYPE html>
<html>
<body>
<button onclick="window.print()">Print this page</button>
</body>
</html>
'컴퓨터+IT' 카테고리의 다른 글
| [뷰어]Autodesk의 DWG, DXF 파일 뷰어(무료 설치) (0) | 2023.08.23 |
|---|---|
| [JavaScript]Operators_자바스크립트 연산자의 종류와 기본설명 (0) | 2023.08.04 |
| [PHP]Operators_PHP연산자의 종류와 설명 (0) | 2023.08.03 |
| [Javascript]볼륨조절 슬라이드바 만들기_input range (0) | 2023.08.02 |
| [JavaScript] input의 입력값(value) 받기 6가지 방법 (0) | 2023.08.01 |
댓글 영역