JavaScript
- 자바와는 전혀 상관이 없다.
- 정적인 HTML을 보완하기 위한 용도로 사용.
- HTML 문서를 제어가능
- HTML5 + JavaScript + css //현재 사용되고 있고 상용되고있는 가장 큰 핵심적인 기술 ( Front-End 기술)
구조
<!DOCTYPE html> <--- html5 표준 문서임을 알리는 시그니쳐
<html> <--- html 문서의 시작을 나타내는 오프닝 태그
<head> <--- 문서의 추가적인 정보를 포함하는 태그
<script>
.... <--- 자바스크립트를 사용하는 태그
</script>
</head>
<body> <--- 화면에 보여지는 정보를 포함하는 태그
<h1>
<a>
<p>
<img>
...
</body>
</html> <--- html 문서의 끝을 나타내는 클로징 태그
위와 같은 구조를 DOM 구조라고 칭한다.
javscript는 세군대서 작성이가능한다.
1. URL에다 작성
위 그림과 같이 URL 자체에다가 Javascript 작성이 가능하다.
2. 크롬(or 다른 브라우져) 의 개발자도구
크롬같은 경우는 F12를 누르게 되면 개발자 모드로 들어가게 되는대 위와같은 콘솔창을 눌러
콘솔창 자체에다가 Javascript을 작성가능하다.
위와같은 결과를 볼수 있다.
3. 웹 개발 당시에..
2017/05/12 - [WEB_Security] - 03. 웹 보안 서버구축
이전시간에 구축 해놓은 서버에다가 웹 개발한것을 올리면 되는대
어제 확인한 경로에다가 html 파일을 하나 만들어 준다.
lorem ipsum을 통해서 의미 없는 글을 복사해와서
붙여 넣어준후 HTML 형식으로 만들어준다.
그럼 서버가 제대로 작동하는지 확인하기위해서
"service httpd start" 를 명령어를 이용하여 서버를 실행시켜주고
자신의 가상머신 아이피를 URL에 입력해준다
위와 같이 뜨면 성공(아파치 서버)
그럼 자신의 IP URL 뒤에 / "파일명" 을 작성해주면 내가 만든 HTML로 들어가진다.
위와 같이나온다면 제대로 만든것
그럼 간단한 javascript를 이용해보자 javascript의 기능중하나인 마우스를 클릭했을때 이벤트를 처리해주는
코드이다.
그럼 첫번째 문단을 클릭하게 되면
위와 같이 첫번째 문단이 변하게된다.
페이지 소스 역시 javascript가 추가된것을 볼수있다.
아 이 사이트는 javascript를 조금더 심도있게 공부할수 있는 사이트이다.
원클릭 이벤트 역시 여기서 배워 사용하였다.
"w3schools.com"
'WEB_Security' 카테고리의 다른 글
| 06. GET,POST 차이 & DB 개념 (0) | 2017.05.17 |
|---|---|
| 05. PHP 구조 및 GET 방식 (0) | 2017.05.16 |
| 03. 웹 보안 서버구축 (0) | 2017.05.12 |
| 02. 웹 보안 ( 개념 ) (0) | 2017.05.10 |
| 01. 리눅스 환경 구축 (0) | 2017.05.10 |
댓글