JavaScript: HTML 출력 작성
예시
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph</p>");팁: HTML 출력에만 document.write를 사용할 수 있습니다. 문서를 로드한 후 이 방법을 사용하면 전체 문서를 덮어쓰게 됩니다.
JavaScript: 이벤트에 반응
예시
<button type="button" onclick="alert('Welcome!')">点击这里</button>alert() 함수는 JavaScript에서 일반적으로 사용되지 않지만 코드 테스트에는 매우 편리합니다.
onclick 이벤트는 이 튜토리얼에서 배우게 될 많은 이벤트 중 하나일 뿐입니다.
JavaScript: HTML 콘텐츠 변경
JavaScript를 사용하여 HTML 콘텐츠를 처리하는 것은 매우 강력합니다.
예시
x=document.getElementById("demo") //查找元素
x.innerHTML="Hello JavaScript"; //改变内容document.getElementByID("some id")를 자주 보게 될 것입니다. 이 메소드는 HTML DOM에 정의되어 있습니다.
DOM(Document Object Model)은 HTML 요소에 액세스하기 위한 공식 W3C 표준입니다.
JavaScript: HTML 스타일 변경
HTML 요소의 스타일을 변경하는 것은 HTML 속성을 변경하는 것의 변형입니다.
예시
x=document.getElementById("demo") //找到元素
x.style.color="#ff0000"; //改变样式JavaScript: 입력 유효성 검사
JavaScript는 사용자 입력의 유효성을 검사하는 데 자주 사용됩니다.
예시
if isNaN(x) {alert("Not Numeric")};HTML의 스크립트는 <script> 태그와 </script>
스크립트는 HTML 페이지의
<script>
alert("My First JavaScript");
</script>
위의 코드를 이해할 필요는 없습니다. 브라우저는 <script>와 </script> 사이의 JavaScript를 해석하고 실행한다는 점만 이해하세요.
이전 인스턴스에서는 <script> 태그에 type="text/javascript"를 사용할 수 있습니다. 더 이상 필요하지 않습니다. JavaScript는 HTML5뿐만 아니라 모든 최신 브라우저의 기본 스크립트 언어입니다. <br />
<body>의 JavaScript<br />
이 예에서 JavaScript는 페이지가 로드될 때 HTML의 <body>에 텍스트를 씁니다. <br />
예시<br />
</p>
<div class="jb51code">
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:js;">
<!DOCTYPE html>
<html>
<body>
.
.
<script>
document.write("<h1>This is a heading</h1>");
document.write("<p>This is a paragraph</p>");
</script>
.
.