자바스크립트를 쓰는 이유 알기
자바스크립트
우리가 매일 접속하는 웹사이트는 크게 3가지 요소로 구성된다. ‘HTML(Hyper Text Markup Language)’, ‘CSS(Cascading Style Sheets)’, ‘자바스크립트(Javascript)’다. HTML은 웹페이지의 큰 뼈대를 제공하고, CSS
terms.naver.com
웹페이지에서 자바스크립트의 역할
1. 마우스와 키보드의 입력 등의 이벤트 처리
2. 동적으로 웹페이지 내용, 모습을 제어
3. 브라우저 창 제어
4. 웹서버와 통신
자바스크립트와 ajax 의 관계
Ajax 에이작스란 '비동기식 자바스크립트 XML' 의 약자로 , 자바스크립트를 활용한 비동기 통신으로 클라이언트와 서버간에 XML 데이터를 주고받는 기술을 말한다.
WEB2.0 의 기반 기술 중 하나로 대화식 웹 애플리케이션의 제작을 위해 사용한다.
페이지의 전환없이 웹브라우저 화면을 동적으로 변경이 가능하며,
구글 맵, 네이버 맵과 같이 페이지의 전환은 없지만 마우스 조작으로 지도의 여려 영역을 표시하며 변경가능한 것도 에이작스를 활용한 기술이다.
비동기의 장점으로는 웹브라우저에서 어떤 조작을 한 경우 서버에서 수정이 필요한 데이터만 얻어 올 수 있고 ,
처리가 매우 가벼워 빠른 일처리가 가능한 점이다.
반면 동기식 처리는 화면 전체를 서버에서 재생성하여 데이터를 처리하기때문에 속도가 느리다.
자바스크립트의 위치
1. HTML 이벤트 리스너 속성안
<태그 oclick=”this.src='b.png' ” />
<태그 onclick="mainPage()"/>
<태그 onclick="window.history.back();"/>
<태그 onsubmit="return onSubmit(event);"/>
2. <script></scriot> 태그 안에
<script language="javascript">
const 변수명 = 1;
function 함수명( ){ 코드수행 }
</script>이 스크립트 태그는 문서내 <head> 나 <body> 안 어디든 가능
스크립트 태그는 여러번 사용 가능하다
3. 자바스크립트 파일에 작성후 첨부
따로 파일.js 를 만들어 자바스크립트 코드를 작성하고 HTML내에 첨부한다
파일.js 안에는 html 태그인 <script>로 감싸지 않는것 주의
하나의 js 파일을 여러곳에서 사용할 수 있는 장점이 있다.
<script src=”파일명.js”></script>
<!--이경우script 태그내에 코드를 적지않고 비워야한다-->4. url 부분에 작성
<!-- <a href=”코드작성”> -->
<a href=”javascript:alert()” >
'프론트엔드 > Java Script' 카테고리의 다른 글
| 리액트 에러 노트 : Warning: Cannot update a component (`UserDataProvider`) while rendering a different component (0) | 2024.04.04 |
|---|---|
| Swiper 라이브러리를 사용하여 js 스와이프 구현하기 (0) | 2022.04.20 |
| 웹 개발환경 오류 노트 : (0) | 2021.06.19 |
| javaScript 태그 갯수 세기 getElementsByTagName 함수 사용 (0) | 2020.11.29 |
| 자바 스크립트 : 무한 회전 텍스트 효과 (0) | 2020.11.13 |
댓글