-
JAVA SCRIPT (basic)web coding/JAVA SCRIPT 2021. 3. 22. 12:00
JAVA SCRIPT (이하 JS)
- 웹 프로그래밍 언어
- 웹 페이지를 제작할 때 사용함
- 동적인 언어, 상호작용에 따라 출력되는 화면에 변화가 생김
- <script> 태그의 사용
- DOM, function, method, property
practice #1 (script, console, document)
<!DOCTYPE html> <html> <head> <script> console.log("head element"); </script> <style> </style> </head> <body> <h1>script</h1> <h1 id="head1">Lorem.</h1> <script> console.log("body element"); </script> <script> console.log("body end tag"); </script> <script> document.getElementById("head1").innerHTML="Hello"; </script> </body> </html>1. <script>
- <head> 또는 <body> 섹션 모두 배치 가능
- 여러 태그 작성 가능
- "", '' 둘 다 사용 가능
- <script> </script>
2. console
- console.log("");
- 파일을 생성하지 않고, 바로 JS코드를 실행해보는 방법
- F12(검사) > console 탭에서 확인 가능
3. method (*DOM)
- DOM Tree 내에서 원하는 정보를 손쉽게 찾고 조작하기 위해 도와줌
- getElementById, getElementByClassName, getElementByTagName
4. property
- innerHTML, attribute, style.property
5. document.getElementById("head1").innerHTML="Hello";
→ "head1" 아이디를 가진 HTML 코드는 콘텐츠를 "Hello" 값으로 새로 변경할 것.
Result #1 (script, console, document)
practice #2
<!DOCTYPE html> <html> <head> <style> /* css comment : css 주석 */ </style> </head> <body> <!-- html comment : html 주석 --> <script> // js Comment : js 주석 /* multi line comments */ // private info xxxxx </script> </body> </html>*JS 주석 (ctrl + /)
// 자바 스크립트 주석