> 웹 프론트엔드 > JS 튜토리얼 > jquery는 data() 요소에 데이터를 저장합니다.

jquery는 data() 요소에 데이터를 저장합니다.

无忌哥哥
풀어 주다: 2018-06-29 13:39:50
원래의
2057명이 탐색했습니다.

요소에 데이터 저장: data()

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>3.在元素中存储数据:data()</title>
</head>
<body>
<img src="../images/peter.jpg" width="200" alt="php中文网" title="朱老师" id="pic" data-job="php中文网朱老师">
</body>
</html>
로그인 후 복사

data(): 요소에서 속성 이름이 data-로 시작하는 사용자 정의 데이터를 읽습니다. 이전 attr() 메서드를 사용하는 경우 data- 접두사

var res = $(&#39;#pic&#39;).data(&#39;job&#39;)
로그인 후 복사

를 생략할 수 있습니다. 완전한 속성 이름을 작성해야 합니다

var res = $(&#39;#pic&#39;).attr(&#39;data-job&#39;)
로그인 후 복사

data()도 자체 판독기와 설정기가 있는 메소드

$(&#39;#pic&#39;).data(&#39;data-course&#39;, &#39;php项目开发课程&#39;)
로그인 후 복사

동적으로 설정된 사용자 정의 속성인 경우 접두사

var res = $(&#39;#pic&#39;).data(&#39;course&#39;)
로그인 후 복사

를 생략하면 가져올 수 없습니다. 접두사를 추가하세요

var res = $(&#39;#pic&#39;).data(&#39;data-course&#39;)
로그인 후 복사

data()는 요소의 기본 속성을 가져올 수 있나요? 읽을 수 없습니다.

var res = $(&#39;#pic&#39;).data(&#39;title&#39;)
로그인 후 복사
로그인 후 복사

하지만 제목 속성의 동적 설정을 지원하며 이는 스크립트에서만 사용하도록 제한됩니다.

var res = $(&#39;#pic&#39;).data(&#39;title&#39;,&#39;hellow&#39;)
로그인 후 복사

이제 스크립트에서 읽을 수 있습니다. 제목 값이 변경되었습니다. 비록 이 값은 원래 alt 값과 다르지만

var res = $(&#39;#pic&#39;).data(&#39;title&#39;)
로그인 후 복사
로그인 후 복사

마찬가지로, data()에도 사용자 정의 또는 생성된 속성을 삭제하기 위한 해당 제거 데이터()가 있습니다

var res = $('#pic').removeData('title')  //仅删除临时创建的,原值不受影响
var res = $('#pic').removeData('data-course')  //仅删除临时创建的
var res = $(&#39;#pic&#39;).data(&#39;data-course&#39;)  //仅删除临时创建的
로그인 후 복사

원래 태그가 함께 제공됩니다. 삭제할 수 없는 맞춤 속성

var res = $('#pic').removeData('data-job') 
var res = $(&#39;#pic&#39;).data(&#39;job&#39;)
로그인 후 복사

콘솔에서 결과 보기

console.log(res)
로그인 후 복사

위 내용은 jquery는 data() 요소에 데이터를 저장합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿