사용자 정의 데이터를 페이지 또는 애플리케이션의 개인 데이터로 HTML에 저장하는 방법은 무엇입니까?

맞춤 속성은 표준 HTML5 속성에 포함되지 않은 특별히 설계된 속성입니다. 이를 통해 우리는 자체 데이터를 추가하여 HTML 태그를 사용자 정의할 수 있습니다.

사용자 정의 속성은 data-로 시작하는 모든 속성입니다. data-* 속성을 사용하여 모든 HTML 구성 요소에 사용자 정의 속성을 포함할 수 있습니다.

구문: HTML

HTML에서 data-* 속성의 구문은 비교적 간단합니다. data-로 시작하는 모든 요소는 data-* 속성입니다.

구문: JavaScript를 사용하여 액세스

JavaScript를 사용하여 이러한 데이터 속성에 액세스하는 것도 비교적 간단합니다. 데이터 세트 속성을 사용하여 읽을 수 있는 전체 HTML 이름과 함께 getAttribute()를 사용할 수 있습니다.

구문: CSS를 사용하여 액세스

CSS의 attr() 함수를 사용하여 데이터에 접근하세요.

여기에 예시가 있습니다...

Example

Example

아래 예에서는 JavaScript를 사용하여 속성 값을 읽습니다.

출력

위 스크립트를 실행하면 일부 데이터가 포함된 이름 목록의 출력이 생성됩니다.

이름 중 하나를 클릭하려고 하면 함수가 데이터를 가져오고 우리가 사용한 사용자 정의 데이터를 보여주는 경고 상자를 표시합니다.

위 내용은 사용자 정의 데이터를 페이지 또는 애플리케이션의 개인 데이터로 HTML에 저장하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!