riix
7/24/2012 - 4:50 AM

jQuery 기본

jQuery 기본

// Switch StyleSheets With jQuery
$('link[media='screen']').attr('href', 'Alternative.css');

// 동적 생성으로 DOM 객체 추가하기
var $newDiv = $('<div></div>');
$newDiv.attr("id","newDiv").appendTo("body");

// 양 객체 사이에 다른 요소 삽입하기
$("p:not(:last-of-type)").after("<br />");

// 모든 인라인 스타일 요소 제거하기
$("*[style]").attr("style", "");

// 외부 링크 타겟 값 부여
$("a[@href^='http']").attr('target','_blank');

// 링크 확장자 탐색하여 해당 확장자 클래스 부여하기
$('a[href]').each(function() {
	if((C = $(this).attr('href').match(/[.](doc|xls|pdf)$/))) { 
		$(this).addClass(C[1]);
	}
});

// 체크박스 토글하기
$('#id').attr('checked', !$('#id').attr('checked'));

// HTML 요소 제거하고 텍스트로 치환하기
var content = $('.class').contents()
$('.class').replaceWith(content);

// 부드럽게 페이지 상단으로 이동
$("a[href='#top']").on('click',function(event) {
	event.preventDefault();
	$('html, body').animate({scrollTop: 0}, 300);
});

// 부드럽게 상하 스크롤 이동하기
$("a.scroll").on('click',function(event) {
	event.preventDefault();
	$("html, body").animate({
		scrollTop: $(this.hash).offset().top + "px"
	}, {
		duration: 500, easing: "swing"
	});
});

// 페이지 상단 안내메시지 보이기
function messageAjax(msg) {
    if ($("body").find("#infoBox").length == 0) {
		$("body").prepend("<div id=\"infoBox\" style=\"height: 20px;background-color:#ffffff;width:100%;display:none;text-align:center;border-bottom:#2BBAE4 1px solid;\"></div>");
	}
	$("body").find("#infoBox").text(msg).slideDown().delay(3000).slideUp();
}

messageAjax('I m on top of everything');

// 숫자만 입력받기
$("input.num").css('ime-mode','disabled').keypress(function(event){
	if((event.which!=8) && (event.which!=0) && (event.which<48 || event.which>57)) {
		return false;
	}
});

// get A URL Hash Parameter
var param = document.URL.split('#')[1];

// get Retrieve root URL
var root = location.protocol + '//' + location.host;

// get current URL
var url = document.URL;

// Change Browser Address Bar Hash Parameter
$('a.demo-link').click(function(){
	var hash = $(this).attr('href');
	location.hash = hash;
});