为div元素添加重要的自定义信息，我该用id,class,name还是其它？_html/css_WEB-ITnose
举个例子，一个web商场的用户购物车里有50项道具，每个道具是一个div，需要把道具id作为一个重要的自定义信息添加到每个div元素的属性里（以方便jquery随时捕捉），比如这个属性的值是item-123456，那么我应该把id,class还是name定义为item-123456？还是有别的更好的办法？
补充1：不会为同一个元素添加超过1条类似的自定义信息，因为所谓自定义信息，主要就是web应用中某个概念的id
补充2：假定可能出现两个id相同的道具分开作为2个商品的情况，而不是堆叠起来用1个div显示
1.如果用id，会导致有重复id；而且，id只能有一个，在一些实际例子中可能会需要对已存在id的元素添加这条自定义信息，就没办法添加了
2.如果用class，道具div本身可能就存在数个class属性，如‘item’,'selected'等等，如果再加入‘item-123456’，似乎目前的js+jquery并不方便获取道具的id值（即123456）
3.如果用name，不清楚是否安全稳定，总感觉name是input专享属性
4.或者有其它更好的解决办法
求各位大神指教，感谢！
回复讨论(解决方案)
用属性、data-
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></head><body> <div id="item_1" itemId="item-123456"></div> <script> // 给标签设置自定义属性 // 参考 JavaScript权威指南_122_第15章_脚本化文档_15.4-属性-获取和设置非标准HTML属性 // http://blog.csdn.net/wuqinfei_cs/article/details/46753659 var item_1 = document.getElementById( "item_1" ); console.info( item_1.getAttribute( "itemId" ) ); </script> <div id="item_2" data-item-id="item-123456"></div> <script> // HTML5 的 data-* 自定义属性 // 参考 JavaScript权威指南_123_第15章_脚本化文档_15.4-属性-数据集属性 // http://blog.csdn.net/wuqinfei_cs/article/details/46753693 var item_2 = document.getElementById( "item_2" ); console.info( item_2.dataset.itemId ); </script></body></html>
핫 AI 도구
Undresser.AI Undress
사실적인 누드 사진을 만들기 위한 AI 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Undress AI Tool
무료로 이미지를 벗다
Clothoff.io
AI 옷 제거제
Video Face Swap
완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
뜨거운 주제
7749
15
1643
14
1397
52
1293
25
1234
29
Python에서 클래스와 메서드를 사용하는 방법
Apr 21, 2023 pm 02:28 PM
클래스와 메소드의 개념과 인스턴스 클래스(Class): 동일한 속성과 메소드를 가진 객체의 컬렉션을 설명하는 데 사용됩니다. 컬렉션의 모든 개체에 공통적인 속성과 메서드를 정의합니다. 객체는 클래스의 인스턴스입니다. 메소드: 클래스에 정의된 함수입니다. 클래스 구성 메서드 __init__(): 클래스에는 클래스가 인스턴스화될 때 자동으로 호출되는 init()라는 특수 메서드(구성 메서드)가 있습니다. 인스턴스 변수: 클래스 선언에서 속성은 변수로 표시됩니다. 이러한 변수를 인스턴스 변수라고 합니다. 인스턴스화: 클래스의 특정 개체인 클래스의 인스턴스를 만듭니다. 상속: 즉, 파생 클래스(derivedclass)가 기본 클래스(baseclass)를 상속합니다.
jQuery를 사용하여 요소의 클래스 이름 바꾸기
Feb 24, 2024 pm 11:03 PM
jQuery는 웹 개발에 널리 사용되는 클래식 JavaScript 라이브러리로, 이벤트 처리, DOM 요소 조작, 웹 페이지에서 애니메이션 수행과 같은 작업을 단순화합니다. jQuery를 사용할 때 요소의 클래스 이름을 바꿔야 하는 상황이 자주 발생합니다. 이 기사에서는 몇 가지 실용적인 방법과 구체적인 코드 예제를 소개합니다. 1. RemoveClass() 및 addClass() 메소드 사용 jQuery는 삭제를 위한 RemoveClass() 메소드를 제공합니다.
파이썬에서 클래스는 무엇을 의미합니까?
May 21, 2019 pm 05:10 PM
클래스는 클래스를 정의하는 데 사용되는 키워드입니다. 클래스 뒤에 공백을 추가하고 클래스 이름을 추가합니다. 규칙: 첫 글자가 여러 개인 경우 카멜 표기법을 사용합니다. [class Dog()]와 같은 이름 지정.
PHP 클래스 사용법에 대한 자세한 설명: 코드를 더 명확하고 읽기 쉽게 만듭니다.
Mar 10, 2024 pm 12:03 PM
PHP 코드를 작성할 때 클래스를 사용하는 것은 매우 일반적인 관행입니다. 클래스를 사용하면 관련 함수와 데이터를 단일 단위로 캡슐화하여 코드를 더 명확하고, 읽기 쉽고, 유지 관리하기 쉽게 만들 수 있습니다. 이 기사에서는 PHPClass의 사용법을 자세히 소개하고 구체적인 코드 예제를 제공하여 독자가 실제 프로젝트에 클래스를 적용하여 코드를 최적화하는 방법을 더 잘 이해할 수 있도록 돕습니다. 1. 클래스 생성 및 사용 PHP에서는 클래스 키워드를 사용하여 클래스를 정의하고 클래스의 속성과 메서드를 정의할 수 있습니다.
Vue 오류: v-bind를 사용하여 클래스와 스타일을 올바르게 바인딩할 수 없습니다. 어떻게 해결합니까?
Aug 26, 2023 pm 10:58 PM
Vue 오류: v-bind를 사용하여 클래스와 스타일을 올바르게 바인딩할 수 없습니다. 어떻게 해결합니까? Vue 개발에서는 클래스와 스타일을 동적으로 바인딩하기 위해 v-bind 지시문을 사용하는 경우가 많지만, 클래스와 스타일을 바인딩하기 위해 v-bind를 올바르게 사용하지 못하는 등의 문제가 발생할 수도 있습니다. 이번 글에서는 이 문제의 원인을 설명하고 해결 방법을 알려드리겠습니다. 먼저 v-bind 지시어를 이해해 봅시다. v-bind는 V를 바인딩하는 데 사용됩니다.
jquery에서 요소에 클래스가 있는지 확인하는 방법
Mar 21, 2023 am 10:47 AM
jquery가 요소에 클래스가 있는지 확인하는 방법: 1. "hasClass('classname')" 메서드를 통해 요소에 특정 클래스가 있는지 확인합니다. 2. "is('.classname)을 통해 요소에 특정 클래스가 있는지 확인합니다. ')" 방법.
!['[Vue 경고]: v-bind:class/ :class' 오류 해결 방법](https://img.php.cn/upload/article/000/465/014/169300902772563.jpg?x-oss-process=image/resize,m_fill,h_207,w_330)
'[Vue 경고]: v-bind:class/ :class' 오류 해결 방법
Aug 26, 2023 am 08:17 AM
"[Vuewarn]:v-bind:class/:class" 오류를 해결하는 방법 Vue를 사용하는 개발 과정에서 흔히 발생하는 오류 중 하나는 "[Vuewarn]:v-bind:class입니다. " /:클래스" 오류. 이 오류 메시지는 일반적으로 v-bind:class 또는 :class 속성을 사용할 때 나타납니다. 이는 Vue가 우리가 설정한 클래스 값을 올바르게 구문 분석할 수 없음을 나타냅니다. 그렇다면 만약
SpringBoot가 사용자 정의 클래스 로더를 통해 클래스 파일을 암호화하고 보호하는 방법
May 11, 2023 pm 09:07 PM
배경 최근에는 jd-gui 등의 디컴파일 도구를 통해 엔지니어링 코드를 쉽게 복원하는 것을 방지하기 위해 회사 프레임워크에 대해 주요 비즈니스 코드를 암호화하고 있습니다. 관련 난독화 기법의 구성 및 사용이 상대적으로 복잡하고, springboot 프로젝트이므로 클래스 파일이 암호화된 후 사용자 정의 클래스로더가 해독되고 로드됩니다. 이 솔루션은 디컴파일의 난이도만 증가시키지만 전반적인 암호화 보호 흐름도는 표시되지 않습니다. 아래 그림에서 Maven 플러그인은 사용자 정의 Maven 플러그인을 사용하여 컴파일을 암호화하며, 암호화된 클래스 파일은 지정된 경로에 복사됩니다.
