레퍼런스 마이닝

jQuery에서는 CSS 선택자를 사용하여 HTML 요소를 선택할 수 있다. 태그 이름으로 선택 요소(element)의 태그 이름으로 HTML 요소를 모두 선택할 수 있다. 이는 자바스크립트의 getElementsByTagName() 메서드와 동일한 동작을 한다. $('button').on('click', function() { $('span').css('fontSize', '30px'); }); 아이디로 선택 요소의 아이디(id)로 특정 HTML 요소를 선택할 수도 있다. 이는 자바스크립트의 getElementsById() 메서드와 동일한 동작을 한다. $('button').on('click', function() { $('#selectorId').css('fontSize', '30px'); }); 클..

jQuery를 사용하면 아주 간편하게 HTML 요소를 선택하고, 그렇게 선택된 요소에 손쉽게 특정 동작을 설정할 수 있다. $(selector).함수(); 달러($) 기호는 jQuery를 의미하고, jQuery에 접근할 수 있게 해주는 식별자이다. 선택자를 이용하여 원하는 HTML 요소를 선택하고, 동작 함수를 정의하여 선택된 요소에 원하는 동작을 설정한다. $() 함수 $() 함수는 선택된 HTML 요소를 jQuery에서 이용할 수 있는 형태로 생성해 주는 역할을 한다. $() 함수의 인수로는 HTML 태그 이름뿐만 아니라, CSS 선택자를 전달하여 특정 HTML 요소를 선택할 수 있다. 이러한 $() 함수를 통해 생성된 요소를 jQuery 객체(jQuery object)라고 한다. jQuery는 이렇..

jQuery 적용 jQuery는 자바스크립트 라이브러리이므로, jQuery 파일은 자바스크립트 파일(.js 파일) 형태로 존재한다. 따라서 웹 페이지에서 jQuery를 사용하기 위해서는 jQuery 파일을 먼저 웹 페이지에 로드(load) 해야 한다. 웹 페이지에 jQuery 파일을 로드하는 방법은 다음과 같다. jQuery 파일을 다운받아 로드 CDN(Content Delivery Network)을 이용하여 로드 jQuery 다운로드 최신 버전의 jQuery 파일은 다음 공식 사이트에서 다운로드할 수 있다. http://blog.jquery.com/ Official jQuery Blog | New Wave Javascript Hello again! jQuery 3.4.0 was released just..

jQuery 사전 지식 Query는 자바스크립트 라이브러리이므로, 자바스크립트 언어에 대한 기초 지식이 필요하다. 또한, HTML 요소을 선택하고, CSS 스타일을 변경하는 등 HTML과 CSS와도 많은 연관이 있다. 따라서 jQuery를 배우기 전에 다음과 같은 기초 지식이 필요하다. HTML CSS JavaScript jQuery란 jQuery는 오픈 소스 기반의 자바스크립트 라이브러리이다. jQuery는 웹 사이트에 자바스크립트를 더욱 손쉽게 활용할 수 있게 해 준다. 또한, jQuery를 사용하면 짧고 단순한 코드로도 웹 페이지에 다양한 효과나 연출을 적용할 수 있다. 그래서 jQuery는 많은 인기 있는 자바스크립트 라이브러리 중 하나이다. jQuery의 장점 jQuery는 주요 웹 브라우저의 ..

퍼블리셔가 있으면 Tooltip 레이아웃을 만들어 적용하겠지만 CSS를 건드리지 않고 아주 간단하게 속성만을 가지고 툴팁을 만드는 방법이다. Title 속성 홍길동 U00126 010-0000-xxxx title 속성은 엘리먼트에 적용할 수 있으며, 해당 요소에 마우스를 올릴 경우 툴팁 창이 나타난다. 공간이 작아서 모든 내용을 보여주지 못할 때 많이 사용된다.

자바스크립트를 이용한 페이징 처리 방법이다. 페이징 파라미터 appendEle : Element totalCount : 데이터 총 카운트 recordsPerPage : 페이지 데이터 레코드 개수 navPage : 페이지 개수 currentPage : 현재 페이지 sellBoolean : 맨앞, 맨뒤 표현 여부 sellBoolean true 일때 (맨앞 맨뒤 미 표출) sellBoolean false 일때(맨앞 맨뒤 표출)

태그에서 accept 속성을 사용하여 첨부하는 파일을 특정할 수 있다. 사용법은 특정 확장자를 지정하거나 미디어 타입을 지정하는 방법이 있다. /* 특정 확장자 */ /* 모든 오디오, 비디오, 이미지 */ /* 미디어 타입 */

Javascript로 웹 페이지의 URL을 가져오는 방법을 알아보자. // 현재 페이지의 URL 반환 window.location.href // 웹 호스트의 도메인명 반환 window.location.hostname // 현재 페이지의 경로와 파일 이름 반환 window.location.pathname // 새 document 로드 window.location.assign

Json 데이터 Key를 뽑는 방법은 아래와 같다. let jsonData = { userId : 'ID0001', userNm : '홍길두', age : 22 }; let key1 = Object.keys(jsonData); console.log(key1); let key2 = Object.getOwnPropertyNames(jsonData); console.log(key2); 동일한 결과를 보여준다. 결과가 같아 보이는데 왜 함수를 다를까? 두 함수의 차이를 알아보자. JavaScript에서 객체의 속성을 정의할 때 enumerable(열거자)를 지정할 수 있다. let object = Object.create({}, { name: {value : 'Micheal', enumerable : false..

document에서 form 태그를 동적으로 생성하여 필요할때 action, method 등 속성을 정의하고 submit하는 것이 가능하다. let newForm = document.createElement('form'); newForm.method = 'POST'; newForm.action = 'https://reference-m1.tistory.com'; newForm.name = 'newForm'; let data = document.createElement('input'); data.setAttribute('type', 'hidden'); data.setAttribute('name', 'userId'); data.setAttribute('value', 'tistory'); newForm.appe..