Bootstrap 3의`data-target` 속성은 무엇입니까?
data-target
부트 스트랩 3에서 사용 하는 속성 뒤에있는 시스템이나 동작이 무엇인지 말해 줄 수 있습니까 ?
나는 데이터 토글이 그래픽 기능의 부트 스트랩의 API JavaScript를 목표로하는 데 사용되었다는 것을 알고 있습니다.
data-target
당신의 삶을 더 쉽게 만들기 위해 부트 스트랩에서 사용됩니다. (대부분) 미리 만들어진 JavaScript 구성 요소 를 사용하기 위해 한 줄의 Javascript를 작성할 필요가 없습니다 .
data-target
속성은 HTML 요소에 포인트가 변경됩니다 CSS 선택기를 포함해야합니다.
<!-- Button trigger modal -->
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal">
Launch demo modal
</button>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
[...]
</div>
이 예에서 버튼은를 data-target="#myModal"
클릭하면 <div id="myModal">...</div>
수정됩니다 (이 경우 페이드 인). 이는 #myModal
CSS 선택기 id
에서 myModal
값 이있는 속성 이있는 요소를 가리 키기 때문에 발생 합니다.
HTML5 "data-"속성에 대한 추가 정보 : https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes
토글은 부트 스트랩에게 무엇을해야하는지 알려주고 타겟은 부트 스트랩에게 어떤 요소가 열릴 지 알려줍니다. 따라서 이와 같은 링크를 클릭 할 때마다 ID가 "basicModal"인 모달이 나타납니다.
참고 URL : https://stackoverflow.com/questions/21944735/what-is-the-data-target-attribute-in-bootstrap-3
'developer tip' 카테고리의 다른 글
Visual Studio, 솔루션 별 들여 쓰기 설정 (0) | 2020.09.19 |
---|---|
참조 또는 값으로 스마트 포인터 (shared_ptr)를 반환하는 방법은 무엇입니까? (0) | 2020.09.19 |
URL에 물음표가 두 개 이상있는 것이 유효합니까? (0) | 2020.09.19 |
A () = A ()-왜 컴파일됩니까? (0) | 2020.09.19 |
내 json 파일을 찾을 수없는 이유는 무엇입니까? (0) | 2020.09.19 |