>  기사  >  웹 프론트엔드  >  ID와 클래스의 차이, 클래스를 사용해야 하나요, ID를 사용해야 하나요?

ID와 클래스의 차이, 클래스를 사용해야 하나요, ID를 사용해야 하나요?

高洛峰
高洛峰원래의
2017-02-27 15:12:513245검색

이전 두 글에서는 관련 지식과 class, id 사용법에 대해 각각 이야기했는데, 실제 프로젝트에서는 class와 id를 어떻게 선택해야 할까요?

둘의 차이점을 먼저 살펴보겠습니다!

1. ID는 고유하고 클래스는 범용이므로 동일한 ID는 한 페이지에 한 번만 사용할 수 있으며, 클래스는 제한 없이 사용할 수 있습니다.

2.id가 클래스보다 우선순위가 높습니다.

  1. #p1{ 색상:빨간색}

  2. .p2{색상:녹색}

  3. 이것은 단락

위는 p 요소의 예입니다. 텍스트는 다음과 같습니다. 녹색 대신 빨간색으로 표시된 이유는 id의 우선순위가 클래스의 우선순위보다 높기 때문입니다.

사실 id와 class의 사용법은 꽤 간단하지만, 우아한 CSS 코드를 작성하려면 몇 가지 사항에 주의해야 합니다. 제가 지금 진행하고 있는 프로젝트는 Agile 모델을 채택하고 있는데, 여러 사람이 함께 작업하여 개발하고 있습니다.
가장 괴로운 점은 HTML 문서 전체에 id와 클래스가 여기저기 있다는 점입니다. 유지하다! 최근에 id와 class를 사용하는 것에 대한 누군가의 경험을 봤는데 요약하면 다음과 같습니다.

css는 클래스에만 작성되며 일반 모듈과 비공개 모듈에 대한 특수 클래스 이름이 있습니다. 너무 높음은 스타일을 추가하지 않고 js가 dom을 작동하는 후크로만 사용됩니다. jq 또는 zepto를 사용하는 경우
작업의 클래스 이름은 일반적으로 이 부분의 클래스 이름 지정에 의해 결정되지 않습니다. js는 ID를 좋아합니다. 이는 대규모, 여러 사람이 유지 관리하고 장기적인 반복 프로젝트에 더 적합합니다.
CSS의 클래스 이름과 JS 작업의 ID 및 클래스가 완전히 분리되어 제품 UI 또는 제품 상호 작용이 변경됩니다. 논리는 서로 영향을 미치지 않으므로 유지 관리가 쉽습니다.

정리하자면 js는 id를 최대한 조작하려고 하고, class는 css를 조작하려고 합니다!

물론 직접 연습해야죠! 현재 진행중인 프로젝트에만 적합합니다! 오늘의 요약은 여기까지입니다. 부족한 점은 바로잡아주세요.

ID와 클래스의 차이점, 클래스를 사용할지 ID를 사용할지에 대한 자세한 내용은 PHP 중국어 홈페이지를 참고해주세요!


성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.