Site Loader

LOCATION

VanY_Y

在很多时候,我们会写jquery的选择器的时候,常常会用到元素的class和id,那么id和class在选择器中有什么不同呢?下面我们来普及一下.

class和id都是html的全局变量,html的全局变量还包括了title、style等等,需要注意的是它不是标签,要把他们和标签区分开来,标签是用来标记HTML元素的,而class和id知识是用来标记元素的。用法如下:

class和id可以任意调控标签的属性

  1. class具备普遍性  <a class=”CLASS”>All my love</a>
  2. id具备唯一性       <a id=”ID”>Only you</a>

我们来举例子说说,人是一个元素,我都会用“帅气的小鲜肉”或者“漂亮女神来形容一个人”,这时候,刚刚所举的两个形容词就形同class,同一个元素或者多个元素上可以用同一个class并共同作用着,其实也就是说这个人”既漂亮又帅气”cheeky,如下图:(你喜欢吗?)

这就是class的普遍性.但是ID就不一样了,ID具有唯一性,ID就好比是一个人的身份证号,每人都有自己独特的身份证号,有人就说啦,我写代码的时候可以多个标签使用同一个ID啊,效果和class一样,那我们来假设有两/三个人用相同的身份证号,那他们拿身份证给别人看的时候是没有问题,但是当我们从身份证库搜索那个ID的时候,我们就不知道哪个人才是我们要找的了,这就是ID的唯一性.

id的唯一性和class的普遍性是w3c标准的,标准并不代表不可以,所以各位亲们,我们写代码的时候还是尽量规范些,这样对自己还是其他人都是有好处的,

说完class和id的特性,我们来说说class和id的权重关系,根据物以稀为贵的原则,id的权重应该会比class重,就好比男的比如花帅,女的比如花漂亮(凤姐除外,因为她们的权重太相近我分不出高低)。好吧,前一部分纯属个人闲聊瞎扯,接下来我们来看看权重是怎么来的。

权重是从0开始,一个内联样式+1000,一个id+100,一个class+10,标签+1.从上面,我们可以看出权重关系:

  1. 内联样式 :<a style=”内联样式”>One</a>
  2. id变量      : <a id=”ID”>Two</a>
  3. class变量  :<a class=”CLASS”>Third</a>
  4. 标签         :<a>Four</a>

现在对于css的权重是不是很明了呢?其实还有一个办法可以颠倒以上的权重排名,那就是在css样式中的某个属性添加!important,这样的可以申明当前属性的权重最大!

===============================2015-11-19============================

我在网上看过一个博客,说了一件很奇妙的事情,是什么呢?那就是关于256个class可以KO掉一个ID,如下图,

原因是为什么呢?

这位大神给出的答案是:“所有的类名(classes)都是以8字节字符串存储的。8字节所能hold的最大值就是255. 当同时出现256个class, 势必会越过其边缘,溢出到id区域。”,在后来,我有看见有大神说,关于class是以多少字符存储的还要看浏览器以多少位存储的。

Post Author: Vany

我是一个喜欢追求技术的小伙,在大学开始之前,自己还是一个电脑白痴,对于电脑,只会开关机,但是由于自己的兴趣,我在选专业的时候,全部选择了计算机专业,其实我也不知道为什么这样不顾家人的反对去做这个决定。上了大学后,我在大一的时候开始接触计算机硬件,设计的领域包括了电脑维修,系统封装等等。在大二的时候,我才开始接触PHP,一开始的时候还不是很懂,也没什么资源,所以学习只能靠老师讲一些特别基础的东西。在大二的一段时间,自己对服务器特别感兴趣,但是资源问题,只能自己慢慢研究,后来通过各种百度,通过翻墙获得了自己的第一个域名,.top域名。后来还弄了一个免费的虚拟空间,在结合域名,我自己弄了一个静态的个人网站。大三的时候,我在网上找到兄弟连这个网站,网站上面有一些免费的视频,特别适合新人看。从那以后,我一直在看教学视频去提高自己的能力,在后来,经过面试八连碰壁,才发现自己之前学的是那么肤浅,而且工作也没有自己想象的那么简单,但是高兴的是,目前工作的那家公司录用了我,在这个公司我真的学会了很多东西,包括一些cms网站的建设啊,微商城开发啊,还有最让自己兴奋的就是微信接口的开发等等这些。即使学了不少东西,但有些时候还是会觉得自己还是个小白,所以我必须不断的提升自己

发表评论

电子邮件地址不会被公开。