<!DOCTYPE html>
<html>
<head>
<title>My First JavaScript Program</title>
</head>
<body>
<h1>My First JavaScript Program</h1>
<p>Click the button to display a message:</p>
<button onclick="myFunction()">Click me</button>
<p id="demo"></p>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Hello World!";
}
</script>
</body>
</html>
This code creates a simple HTML page with a button that, when clicked, displays the message "Hello World!" using JavaScript. The JavaScript code is embedded in the HTML using the <script> tag. The function myFunction() is called when the button is clicked, and it uses the document.getElementById() method to find the HTML element with the id "demo" and change its innerHTML property to "Hello World!".
Javascript Code Preview:
My First JavaScript Program
Click the button to display a message:
JavaScript는 대화식 및 동적 웹 페이지를 만드는 데 사용되는 프로그래밍 언어입니다. 클라이언트 측 스크립팅 언어이므로 서버가 아닌 사용자의 컴퓨터에서 실행됩니다. 따라서 사용자 입력에 응답하는 동적 웹 페이지를 만들기위한 강력한 도구가됩니다.
위의 코드는 JavaScript를 사용하여 대화식 웹 페이지를 만드는 방법에 대한 간단한 예입니다. HTML 코드는 클릭하면 myFunction () 함수를 호출하는 버튼을 만듭니다. 이 함수는 document.getElementById () 메소드를 사용하여 ID ""데모""가있는 HTML 요소를 찾아 내면 속성을 ""Hello World!""로 변경합니다.
Document.getElementByid () 메소드는 JavaScript를 사용하여 HTML 요소를 조작하는 강력한 도구입니다. ID로 HTML 요소를 찾은 다음 InnerHTML, 스타일 또는 클래스와 같은 속성을 변경할 수 있습니다.
이 예에서 내부 HTML 속성은 HTML 요소에 표시된 텍스트를 ID ""데모""로 변경하는 데 사용됩니다. 이것은 간단한 예이지만 동적 웹 페이지를 만들기위한 JavaScript의 힘을 보여줍니다.
JavaScript는 간단한 양식 검증에서 복잡한 애니메이션 및 게임에 이르기까지 광범위한 작업에 사용할 수있는 다목적 언어입니다. 모든 최신 웹 브라우저에서 지원되며 모든 웹 개발자에게 필수 도구입니다.
결론적으로 위의 코드는 대화식 웹 페이지를 만드는 데 JavaScript를 사용하는 방법의 간단한 예입니다. javaScript를 사용하여 HTML 요소를 조작하기위한 document.getElementById () 메소드의 힘을 보여줍니다. JavaScript는 모든 웹 개발자에게 필수적인 다목적 언어이며 간단한 양식 검증에서 복잡한 애니메이션 및 게임에 이르기까지 광범위한 작업에 사용할 수 있습니다.
Document.getElement
document.getElementById는 고유 한 ID 속성으로 dom (Document Object Model)에서 HTML 요소를 검색하는 데 사용되는 JavaScript의 메소드입니다.
이 방법을 사용하기위한 구문은 다음과 같습니다.
```
document.getElementById ( ""ElementID"");
```
여기서 ""ElementID""는 검색하려는 HTML 요소의 ID 속성 값입니다.
이 방법을 사용하여 요소를 검색 한 후에는 내용, 스타일 또는 속성 변경과 같은 다양한 작업을 수행 할 수 있습니다.
예를 들어, ID ""Mylement""가있는 HTML 요소가 있고 텍스트 내용을 변경하려면 다음 코드를 사용할 수 있습니다.
```
var element = document.getElementById ( ""mylement"");
요소 .textContent = ""새 텍스트 내용"";
```
이렇게하면 ID ""Myelement""로 요소를 검색하고 텍스트 내용을 ""새 텍스트 내용""으로 변경합니다.
전반적으로 Document.GetElementById는 JavaScript의 강력한 방법으로 HTML 요소를 동적으로 조작하고 동적 웹 페이지를 생성 할 수 있습니다.
Javascript ?
JavaScript는 대화식 및 동적 웹 페이지를 만드는 데 사용되는 고급 해석 프로그래밍 언어입니다. 사용자의 웹 브라우저에서 실행되는 클라이언트 측 스크립팅 언어로 개발자가 웹 페이지에 기능을 추가하고 대화식 사용자 인터페이스를 만들 수 있습니다.
JavaScript는 1995 년 Brendan Eich에 의해 만들어졌으며 이후 세계에서 가장 인기있는 프로그래밍 언어 중 하나가되었습니다. 웹 개발, 모바일 앱 개발, 게임 개발 및 서버 측 프로그래밍을 포함한 광범위한 응용 프로그램에 사용됩니다.
JavaScript는 객체 지향, 기능 및 절차 적 프로그래밍을 포함하여 다양한 프로그래밍 패러다임을 지원하는 다목적 언어입니다. 간단한 구문이 있으며 배우기 쉽기 때문에 초보자에게 이상적인 언어가됩니다.
JavaScript의 주요 기능 중 일부는 웹 페이지의 DOM (Document Object Model)을 조작하는 기능, 비동기 프로그래밍 지원 및 HTML 및 CSS와 같은 다른 웹 기술과 협력하는 기능을 포함합니다.
전반적으로 JavaScript는 현대적이고 대화식 웹 애플리케이션을 만드는 데 필수적인 강력하고 유연한 프로그래밍 언어입니다.
'구글덕후의 HTML > 구글덕후의 Javascript' 카테고리의 다른 글
| Javascript 이벤트핸들러(Event Handler) (0) | 2023.03.17 |
|---|