jQuery

jquery 기본

좀 뒤늦게 jquery 기본 사용법(?)에 대해서 정리. 처음에는 JS문법으로 예제를 썼지만, 뒤로 갈 수록 LS문법을 씁니다.(괄호라든지 괄호라든지 괄호때문에…) jQuery Object jQuery 객체는 DOM 요소(단일요소 혹은 집합)에 대해 $()를 이용하여 생성한 객체를 의미한다. 이는 내부적으로 DOM 요소를 참조하면서 jQuery에 의해 제공되는 공통 API를 적용받게 된다. 속성들 .attr() 메소드는 getter/setter로 동작하며, 해당 DOM요소의 속성을 얻거나 변경할 수 있다. $('a').attr('href', 'allMyHrefsAreTheSameNow.html'); $('a').attr({ title: 'all titles are the same too!', href: 'somethingnew.html' }); $('a').attr('href'); //=> 첫 A 요소의 'href' 값을 리턴한다. 요소 선택 요소… 더 보기 »jquery 기본

이미지의 크기를 알려주는 북마클릿

by user
2012-12-28
21세기소년

이미지 사이즈를 체크해서 title 속성으로 넣어주는 스크립트. 북마클릿으로 만들어서 손쉽게 웹페이지의 이미지들의 가로/세로 크기값 및 CSS에서 지정한 가로/세로 값을 툴팁으로 알려줌. 일일이 인스펙터에서 확인하기 귀찮아서 만듬. javascript:/*Lastest Version*/ (function(){ var latestVersion = ‘1.8.2’; var jQueryEnabled = false; if(window.jQuery === undefined || window.jQuery.fn.jquery < latestVersion){ var script = document.createElement(‘script’); script.src = ‘http://ajax.googleapis.com/ajax/libs/jquery/’+latestVersion+’/jquery.min.js’; script.onload = script.onreadystatechagne = initMyjQuery; document.getElementsByTagName(‘HEAD’)[0].appendChild(script); } else { initMyBookmarklet(); } function initMyjQuery(){ if($ === undefined){ $ = jQuery; } jQueryEnabled = true; initMyBookmarklet(); } function initMyBookmarklet(){ var ai… 더 보기 »이미지의 크기를 알려주는 북마클릿

jQuery 공부하기 – 1

jQuery는 “더적게 써서 (타이핑해서) 더 많은 일은 한다”는 취지로 만들어진 자바스크립트 프레임워크이다. 114kb라는 저용량에도 불구하고 상당히 많은 내용을 포함하고 있으며, 자바 스크립트를 통해 DOM을 제어할 때의 가장 귀찮은 점 두 가지 – 원하는 객체를 특정(selecting element)하는 일과 그 객체들에 대해 반복적으로 어떤 작업을 수행하는 것-를 매우 간단히 만들어줄 수 있다. 덕분에 jQuery를 사용하는 경우, 자바 스크립트 코드를 기존 대비해서 엄청나게 줄일 수 있다고 한다. jQuery는 기본적으로 ‘선택자’를 사용하여 DOM 객체들을 골라올 수 있다. 기존 자바스크립트에서는 document 객체를 통해 id, 이름,… 더 보기 »jQuery 공부하기 – 1