본문 바로가기

javascript

(5)
jQuery jQuery는 자바스크립트를 사용하는 사람들이 많이쓰는 라이브러리 ( 라이브러리 : 자주 사용하는 로직을 재사용할 수 있도록 고안된 소프트웨어 ) jQuery의 기본 문법은 단순하고 강력. $('li'').css('color','red'); $( )는 jQuery의 함수, 이 함수의 인자로 CSS selector(선택자) (ex: (li))를 전달하면 jQuery 객체라는 것을 리턴한다. jQuery 함수가 리턴하는 것이 jQuery 객체 이 객체는 선택자에 해당하는 엘리먼트를 제어하는 다양한 메소드를 가지고 있다. 위에서 css는 선택자에 해당하는 객체들의 style에 color:red로 변경한다. DOM(Document Object Model) 기반으로 자바스크립트를 사용할때와 jQuery 기반으로 ..
제어 대상 찾기 ( getElementById ) 이번에 배우는 getElementsById는 사용되는 빈도가 많다. id값을 기준으로 객체를 조회하며 , 성능면에서 가장 우수하다! 특징은 이전에 배웠던 getelementsByTagname 과 getElementsByClassName과는 다르게 element가 단수형이다. 즉 얘가 조회한 결과는 하나의 결과만 갖는다는 특징이 있다. 또한 html의 속성중 id값을 기준으로 조회한다. (문서에서 id는 하나의 엘리먼트만 식별하는 특별한 식별자다!) 다음 예시를 보자. 10행에서 li태그 중 id값을 가진 엘리먼트는 하나 뿐이다. 이때 getElementById를 이용한다. 14행을 보자 , li = document.getElementById('active');이 문서에서 Id값이 'active'인 엘리먼..
제어 대상 찾기 ( getElementsByClassName ) 두번째로 소개할 태그(엘리먼츠) 조회방법은 ClassName이다. 말 그대로 클래스의 이름을 기준으로 조회한다. 여기 문서를 보면 li태그중 2개의 태그만 클래스의 값이 'active'다. HTML에서는 클래스라고 하는것이 자바스크립트에서는 클래스 네임이라는 표현을 쓴다. 14행에서 인자로 전달된 값('active')에 해당되는 클래스 네임을 갖고있는 엘리먼트들을 조회해서 그것을 유사배열에 담는 메소드다. 그렇게 해서 담긴 lis를 for문으로 처리하면 앞서봤던 getElementsByTagName에서 본것과 같이 동일하게 처리된다.
조건문 일치 연산자 ( ===) : 데이터의 타입과 값까지 똑같은 경우 참을 반환 , ex)(1===1) //true ('1'===1) //false 조건문 : 주어진 조건에 따라서 application을 다르게 동작하게 하는것 . 문법을 살펴보자 if(true) {조건 '참'일시 실행 } 조건문을 사용할땐 Boolean값을 기준으로 움직임. c언어와 같이 else , else if 문 또한 제공 이번에는 에디터를 이용해서 조건문을 중첩하여 코드를 짜보자. prompt() : 사용자에게 입력값을 받을수 있도록 프롬프트 창을 띄워줌.prompt함수를 이용하여 로그인 관련 인증 코드를 간략하게 짰다.실행해보자. ID를 입력해주고 비밀번호를 입력해줬다. 로직대로 실행되었다. 이번엔 논리 연사자에 대해 정리하자 . (..
JavaScript 시작 JavaScript는 웹브라우저를 동적으로 , 프로그래밍 적으로 제어하기 위해서 고안된 언어다. 그렇기 때문에 오늘날 가장 중요한 플랫폼이라고 할 수 있는 웹브라우저에서 유일하게 사용할 수 있는 프로그래밍 언어다. 자바스크립트는 배우기 쉬운 언어라고 한다 , 그 이유는 여러가지가 있겠지만 아는 만큼 사용할 수 있는 언어라는 특성이 제일 크다. 자바스크립트가 전반적으로 웹쪽에서 많이 쓰이지만 자바스크립트가 요즘은 탈 웹브라우저화? 되서 할 수 있는 것들을 정리해보자. 웹페이지 스크립팅(DOM) , 서버측 스크립팅(node.js) , 브라우저 확장기능( ex:Chrome Extensions ,opera...etc) Adobe PDF , Unity 게임엔진 , 채팅 시스템등 여러곳에 응용 될 수있다. 나는 워..