목록Web (152)
알쓸전컴(알아두면 쓸모있는 전자 컴퓨터)
Chain이란? jQuery의 메소드들은 반환값으로 자기 자신을 반환해야 한다는 규칙을 가지고 있다.이를 이용하면 한번 선택한 대상에 대해서 연속적인 제어를 할 수 있다. jQuery chain의 장점 1.코드가 간결해진다.2.인간의 언어와 유사해서 사고의 자연스러운 과정과 일치함. 탐색(traversing) chain의 대상을 바꿔서 체인을 계속 연장시킬 수 있는 방법 너무 복잡한 chain은 코드의 가독성을 떨어 뜨릴 수 있다. list item 1 list item 2 list item 3 list item 1 list item 2 list item 3
JQuery 선택자 Jquery는 강력하게 엘리먼트를 선택할수 있는 수단들을 많이 제공 합니다. 생활코딩 사이트에서 선택자 예제중 가장 좋은 예제 같네요 기본 HTML CSS javascript jQuery PHP MYSQL HTML CSS javascript jQuery PHP MYSQL - id 선택자 - class 선택자 - 엘리먼트 선택자 - 다중 선택자 filter HTML CSS javascript PHP MYSQL HTML CSS javascript PHP MYSQL - 인자와 인덱스가 동일한 엘리먼트를 찾아내는 선택자 - 인자 보다 인덱스가 큰 엘리먼트를 찾아내는 선택자 - 인자 보다 인덱스가 작은 엘리먼트를 찾아내는 선택자 - 첫번째, 세번째... 홀 수의 인덱스 값을 가진 엘리먼트에 대..
javascript vs JQuery 해당 강의를 보기 전에 javascript를 알고 보는것이 좋습니다. 먼저 javascript 예제 코드 입니다. HTML CSS javascript jQuery PHP mysql 위 샘플 코드가 많으니 분석을 해보도록 하겠습니다. HTML CSS javascript jQuery PHP mysql 이코드만 보면 css 는 select 라는 이름의 클래스를 background-color:red;color:white; 으로 만들어 주는 군요. function addEvent(target, eventType,eventHandler, useCapture) { if (target.addEventListener) { // W3C DOM target.addEventListener..
jQuery란? 엘리먼트를 선택하는 강력한 방법과 선택된 엘리먼트들을 효율적으로 제어할 수 있는 다양한 수단을 제공하는 자바스크립트 라이브러리입니다. - 엘리먼트는 HTML 의 요소 들입니다. 예를 들면 java script 에서 사용 했던 document.getElementsByTagName, document.getElementsByClassName,document.getElementById 을 통해 선택 했던 기능과 똑같지만 더강력하게 찾을수 있는 방법과 이를 javascript 보다 더욱 효율적으로 제어할수 있는 방법을 제공하는 라이브러리 입니다. JQuery를 사용하기 위해서는 JQuery 라이브러를 가지고 와야합니다. 부분이 구글 JQuery 라이브러리를 가지고 부분으로써 JQuery를 사용하기..
DOM[Document Object Model] Document Object Model로 웹페이지를 자바스크립트로 제어하기 위한 객체 모델을 의미한다. window 객체의 document 프로퍼티를 통해서 사용할 수 있다. Window 객체가 창을 의미한다면 Document 객체는 윈도우에 로드된 문서를 의미한다고 할 수 있다. 가상 쉽게 접근성이 높은 방법부터 예제를 들겠습니다. document.getElementsByTagName 문서에서 태그를 찾을수 있는 객체 함수 입니다. 일반적으로 DOM 객체는 document 을 통해 접근합니다. test.html HTML CSS JavaScript 크롬 개발자 도구 콘솔(단축키 F12)var a = document.getElementsByTagName('l..
[javascript] 창제어 사용중인 웹브라우져의 창을 제어할때 어떻게 제어하는지 알아 보겠습니다. 먼저 windwos.open() 함수는 새로운 창을 여는 함수 입니다. newopenhtml.html 첫번째 인자는 새 창에 로드할 문서의 URL이다. 인자를 생략하면 이름이 붙지 않은 새 창이 만들어진다. 두번째 인자는 새 창의 이름이다. _self는 스크립트가 실행되는 창을 의미한다. _blank는 새 창을 의미한다. 창에 이름을 붙일 수 있다. open을 재실행 했을 때 동일한 이름의 창이 있다면 그곳으로 문서가 로드된다. 세번재 인자는 새 창의 모양과 관련된 속성이 온다. 그리고 demo2.html 을 newopenhtml.html 이 있는 폴더에 만들어 줍니다. demo2.html test wi..
BOM(Browser Object Model)BOM(Browser Object Model)이란 웹브라우저의 창이나 프래임을 추상화해서 프로그래밍적으로 제어할 수 있도록 제공하는 수단이다. BOM은 전역객체인 Window의 프로퍼티와 메소드들을 통해서 제어할 수 있다. 따라서 BOM에 대한 수업은 Window 객체의 프로퍼티와 메소드의 사용법을 배우는 것이라고 해도 과언이 아닐 것이다. Location 객체 하지만 location 객체를 에디터로 테스트 하기 어려운 면이 있어서 크롬을 켜고 F12 단축키를 눌러서 개발자 모드를 실행합니다. 이부분에 입력 해서 샘플 코드를 진행 하겠습니다. console.log(location.protocol, location.host, location.port, locat..
alert경고창이라고 부른다. 사용자에게 정보를 제공하거나 디버깅등의 용도로 많이 사용한다. confirm confirm('ok?') 은 yes을 누를 경우 리턴으로 true를 하고 cancle 을 누를 경우에 false 를 리턴 합니다. prompt 리턴 값으로는 입력하고 확인 버튼을 누른 값으로 리턴합니다.
Window 객체Window 객체는 모든 객체가 소속된 객체이고, 전역객체이면서, 창이나 프레임을 의미한다 전역객체Window 객체는 식별자 window를 통해서 얻을 수 있다. 또한 생략 가능하다. Window 객체의 메소드인 alert을 호출하는 방법은 아래와 같다. 전역변수 a 접근하는 방법은 아래와 같다. 객체를 만든다는 것은 결국 window 객체의 프로퍼티를 만드는 것과 같다. 예제를 통해서 알 수 있는 것은 전역변수와 함수가 사실은 window 객체의 프로퍼티와 메소드라는 것이다. 또한 모든 객체는 사실 window의 자식이라는 것도 알 수 있다. 이러한 특성을 ECMAScript[표쥰 javascript]에서는 Global 객체라고 부른다. ECMAScript의 Global 객체는 호스트 ..
Object Model Object Model 을 익힌 다는것은 java script 를 웹브라이저를 제어하기 위한 목적으로 사용됩니다. java script의 언어로 웹브라우저 의 Object 을 제어가는 것이 목적인 것이죠 . object가 추상적으로 느껴 질수 있습니다. 그이유는 직접 코드를 작성한 부분이 아니고 웹브라우져에서 지원하는 개념이기 때문에 object 속에 웹브라이저와 어떻게 연동 되어 작동 되는지 일일이 알지 못해도 java script 를 이용해 제어 할수 있도록 브라우저 회사 또는 표준화 단체에서 메뉴얼을 주고서는 사용하라고 하는것이죠. java script 를 이용하여 웹브라이저를 제어할때 쓰이는 객체는 위와 같은 구조를 보입니다. windows 는 최상위 object 이며 이 ..