학원/jQuery

20_jQuery 기본 명령 활용

행수쌤 2023. 3. 14. 20:29
728x90
반응형

jQuery 축약 과정

jQuery(window).on("load", function(){});
$(window).on("load", function(){});
$(document).on("ready", function(){});
$(document).ready(function(){});
$().ready(function(){});
$(function(){});

style(css)를 객체로 사용

$(".target").css({
	width: size + "px",
	height: size + "px",
});

event bubbling 방지

$(".target").click(function (e) {
	e.stopPropagation();
});

jQuery 반복문

//$(대상).each()
$(".check-unit").each(function(){});

html 불러오기 및 해석가능한 상태로 만들기

var html = $("#template-sample").html();
var parse = $.parseHTML(html);

form 활용

//form안에 있는 데이터를 전송 가능한 형태로 문자열 반환
var data = $(this).serialize();
//form 안에 있는 데이터 초기화
$("form").get(0).reset();

객체 안에 getter 생성(ES6 이후)

var valid{
    nameValid: true,
    get allValid(){
      return this.nameValid;
    }
}
valid.allValid

url 표기방법

url:"http://localhost:8080/rest/subject/delete"+no,
url:`http://localhost:8080/rest/subject/${no}`,  //ES6 이후

파라미터 가져오기(URLSearchParams)

var params = new URLSearchParams(location.search);
boardNo : params.get("boardNo")

태그를 변수로 생성

var author = $("<span>").addClass("author").text("(작성자)");

.map() : 지정된 함수를 실행하고 결과를 배열로 반환

var newArr = $.map(arr, function(value, index) {
  return value + 1;
});
728x90
반응형