Front-End27 [jQuery] data() data()는 HTML element에 메타 데이터 정보를 읽는 역할을 하는 함수이다. data 저장 var tar = document.getElementByTagName('h2')[0]; //$('h2')[0] //방법1 tar.setAttribute('data-color', 'red'); //test //방법2 tar.dataset.color = 'blue'; //test //결과 확인 console.log(tar.outerHTML); data 읽기 var tar = document.getElementByTagName('h2')[0]; //방법1 var color = tar.getAttribute('data-color'); //red //방법2 var color = $(tar).data('color'.. 2019. 5. 28. [HTML] data 속성 (data-*) 모든 element에 data-*로 시작하는 속성은 모두 사용할 수 있다. 화면에 보이지 않는 추가 정보를 element에 담아 놓고 사용할 수 있다. javascript와 css에서 활용할 수 있다. Explorer11+는 표준을 지원하지만, 이전 버전들은 dataset을 지원하지 않는다. IE10 이하를 지원하기 위해서는 getAttribute()를 통해 데이터 속성에 접근해야 한다. Reference https://developer.mozilla.org/ko/docs/Learn/HTML/Howto/%EB%8D%B0%EC%9D%B4%ED%84%B0_%EC%86%8D%EC%84%B1_%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0 데이터 속성 사용하기 HTML5 특정 요소와 연관되어 .. 2019. 5. 28. [jQuery] on('click') & click Event on('click')은 element에 동적으로 이벤트를 바인딩이 가능하지만 click은 처음에 선언된 element에만 동작한다. 여기서 처음에 선언된 element는 맨 처음 페이지를 로딩하였을 때 선언되어 있는 element를 의미한다. 즉 on('click')은 페이지에서 동적으로 새로운 태그들이 추가되어도 이벤트를 줄 수 있다. Test code $('#test').on('click', function(){ alert('test success'); }); $(document).on('click', id, function) 와 같은 형태로도 사용할 수 있다. $(document).on('click', '#test', function(e) { var tar = e.currentTarget; var .. 2019. 5. 28. [JavaScript] forEach() var alpha = ['a', 'b', 'c', 'd']; alpha.forEach(function (item, index, array) { console.log(item, index); }); //a 0 //b 1 //c 2 //d 3 Reference https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach Array.prototype.forEach() forEach() 메서드는 주어진 함수를 배열 요소 각각에 대해 실행합니다. developer.mozilla.org 2019. 5. 27. 이전 1 2 3 4 5 ··· 7 다음