jQuery / javascript 비교. getAttribute와 attr

 

getAttribute() , attr() 둘다 선택한 요소에서 원하는 속성을 가져오고 싶을 때 사용합니다.

 

//자바스크립트
let select = document.querySelector(".class");

let getAttr = select.getAttribute("class");

select.textConetent =getAttr;


//제이쿼리
let getAttr = $(".class").attr("class");

$(".class").text(getAttr);

이러한 차이가 있습니다.  제이쿼리를 이용하면 더 간편하게 작업을 할 수 있습니다.

하지만!

제이쿼리의 가장 큰 단점은 속도입니다. 속도가 순수 자바스크립트로 코딩한 것보다 현저히 느립니다. 특히 애니메이션을 할 경우, 브라우저가 지원하는 css 애니메이션보다 느린 경우가 많습니다. (브라우저는 특정 상황에서 GPU를 사용해서 애니메이션을 표현하기 때문에 훨씬 빠릅니다.)

상황에 맞게 적절히 사용합시다.