728x90
반응형

custom-data-attribute 5

jQuery data vs attr 사용법 차이

질문 : jQuery 데이터 대 Attr? data-someAttribute 사용할 때 $.data 와 $.attr 사용법 차이는 무엇입니까? 내 이해는 $.data 가 DOM이 아닌 jQuery의 $.cache 따라서 데이터 저장에 $.cache $.data 사용해야합니다. HTML5 데이터 속성을 추가하려면 $.attr("data-attribute", "myCoolValue") 합니다. 답변 서버에서 DOM 요소로 데이터를 전달하는 경우 요소에 데이터를 설정해야합니다. foo! 그런 다음 jQuery에서 .data() 를 사용하여 데이터에 액세스 할 수 있습니다. console.log( $('#foo').data('foo') ); //outputs "bar" 그러나 데이터를 사용하여 jQuery의 D..

jQuery로 데이터 속성으로 요소 선택하는 방법

질문 : jQuery로 데이터 속성으로 요소 선택 data 속성을 기반으로 요소를 선택하는 쉽고 간단한 방법이 있습니까? 예를 들어 값이 22 customerID 라는 데이터 속성이있는 모든 앵커를 선택하십시오. rel 또는 기타 속성을 사용하는 것을 주저하지만 어떤 데이터가 저장되어 있는지에 따라 요소를 선택하는 것이 훨씬 더 어렵습니다. 답변 $('*[data-customerID="22"]'); * 를 생략 할 수 있어야하지만 올바르게 기억하면 사용중인 jQuery 버전에 따라 잘못된 결과를 얻을 수 있습니다. 선택기 API ( document.querySelector{,all} 22 ) 주변의 따옴표를 생략 할 수 없습니다 . 또한 jQuery 스크립트에서 데이터 속성을 많이 사용하는 경우 HTML..

HTML5를 사용하는 사용자 정의 데이터 속성에 대한 jQuery 선택자

질문 : HTML5를 사용하는 사용자 정의 데이터 속성에 대한 jQuery 선택기 HTML5와 함께 제공되는 이러한 데이터 속성에 사용할 수있는 선택기를 알고 싶습니다. 이 HTML 부분을 예로 들어 보겠습니다. 얻을 선택자가 있습니까? "Companies" 아래에 data-company="Microsoft" 모든 요소 "Companies" 아래에 data-company!="Microsoft" 모든 요소 다른 경우에는 "포함, 미만, 초과 등 ..."과 같은 다른 선택기를 사용할 수 있습니다. 답변 $("ul[data-group='Companies'] li[data-company='Microsoft']") //Get all elements with data-company="Microsoft" below ..

CSS에서 속성으로 요소 선택

질문 : CSS에서 속성으로 요소 선택 data-role )으로 CSS의 요소를 선택할 수 있습니까? 답변 속성 선택기를 사용하는 것을 의미하는 경우 다음과 같은 이유가 있습니다. [data-role="page"] { /* Styles */ } 내가 링크하는 문서에서 모두 다루는 다양한 시나리오에 사용할 수있는 다양한 속성 선택기가 있습니다. 맞춤 데이터 속성이 '새로운 HTML5 기능'임에도 불구하고 브라우저는 일반적으로 비표준 속성을 지원하는 데 문제가 없으므로 속성 선택기로 필터링 할 수 있어야합니다. 과 CSS 유효성 검사에 대해서도 걱정할 필요가 없습니다. CSS는 선택기 구문을 깨지 않는 한 네임 스페이스가 지정되지 않은 속성 이름에 대해 신경 쓰지 않기 때문입니다. 출처 : https://s..

jQuery 데이터 속성 값을 기반으로 요소를 찾는 방법

질문 : jQuery 데이터 속성 값을 기반으로 요소를 찾는 방법은 무엇입니까? 다음과 같은 시나리오가 있습니다. var el = 'li'; 페이지에는 각각 data-slide=number 속성 (숫자는 각각 1,2,3,4,5 임) 이있는 5 개의 가 있습니다. var current = $('ul').data(current); 매핑 된 현재 활성 슬라이드 번호를 찾아야합니다. 슬라이드가 변경 될 때마다 업데이트됩니다. 지금까지 내 시도는 실패했으며 현재 슬라이드와 일치하는 선택기를 구성하려고 시도했습니다. $('ul').find(el+[data-slide=+current+]); 일치하지 않거나 아무것도 반환하지 않습니다… li 부분을 하드 코딩 할 수없는 이유는 이것이 필요한 경우 다른 요소로 변경할 수..

728x90
반응형