原文地址:https://blog.csdn.net/zxw136511485/article/details/71191053

在div 标签中,我们比较常见的属性是id 和class,那么这两个属性有什么区别吗?今天就来看看这两者的区别。其实id 和class是大部分标签都有的属性。其作用是让CSS或者JavaScript找到DOM元素并操作。

首先看看这两个属性在html中是如何使用的。

<div id="loading"> </div>
<div class="icon"> </div>
解释上面的代码,
id="loading",意思是定义了一个id,它的值是“loading”;

class="icon" 意思是定义了一个类,它的类名是“icon”;
PS: “loading”和“icon”的是自定义的值,命名规范都要遵守相应的命名规则,这个请自行查阅。
那么这两个属性是使用的时候有什么区别吗?什么时候用id?什么时候用class呢?请看下文。
1.定义区别。
(1).id具有唯一性,在一个网页中只能定义一次;
(2).class命名的类,可以出现多次。
2.使用区别。
(1).id在CSS中是以“#”开头的命名的;
(2).class在css中是以“.”开头命名的;
PS:
1.一般来说,id是元素的唯一代号,给某个元素赋予一个id后,通常不会再有其他元素有一样的id。CSS和JavaScript可以使用id来单独操作某一个元素;而class是一组(多于一个)元素的共同代号,通常网页中会有一组元素具有一样的class。CSS和JavaScript中对某个class的操作会反映到每一个对应的元素上。
2.ID是一个标签,用于区分不同的结构和内容,就象名字,如果一个屋子有2个人同名,就会出现混淆;class是一个样式,可以套在任何结构和内容上,就象一件衣服;
从概念上说就是不一样的:id是先找到结构/内容,再给它定义样式;class是先定义好一种样式,再套给多个结构/内容。

最新文章

  1. 局域网内利用gitlab,jenkins自动生成gitbook并发布(nginx)
  2. JS 关闭页面事件
  3. Android 下载文件 显示进度条
  4. [转]O(n)回文子串算法 Manacher算法
  5. Android 调节当前Activity的屏幕亮度
  6. XShell提示Connection closed by foreign host的问题 和 路由器分配IP的规则
  7. 在List中找出最大值的两种方法
  8. Android-第一个Android程序
  9. linux中BASH_SOURCE[0]
  10. delphi BitmapCompress
  11. P3390 【模板】矩阵快速幂
  12. 9.QT-标准对话框
  13. 通过数据流处理-微信小程序生成临时二维码
  14. vue 源码学习二 实例初始化和挂载过程
  15. Promise杂记
  16. 闲话ACES(修订)
  17. JSAP104
  18. 关联规则挖掘算法之Apriori算法
  19. Java第三次作业——面向对象基础(封装)
  20. Event 对象的属性和方法

热门文章

  1. redis之线程IO模型
  2. redis命令之 ----List(列表)
  3. python yield from (二)
  4. 【机器学习笔记】Python机器学习基本语法
  5. Linux下实现不活动用户登录超时后自动登出
  6. webpack4 打包静态资源
  7. 玄学 npm报错记录
  8. linux 通过wol远程开机【转】
  9. BCD解密
  10. flask POOL,websocket握手