发表于： 2017-03-30 22:03:32
1 1235
今天完成的事情：开始任务2的学习和探索，上午主要在编写静态页面，并找出任务13的相关网页，调整了简化版三个字所在按钮的链接和跳转的属性。下午开始小课堂知识的整理就没有继续进行任务。晚上查看了几个师兄的日志，调整了静态页面中数字区域，市值变成input标签。
明天计划的事情：继续按照任务2的步骤向下进行，学习js中input相关的知识，完成每个步骤。
遇到的问题：进行静态页面的编写，基本没有遇到问题，不再赘述。
收获：整理一下下午讲的小课堂的内容：
ID和class的区别
1.背景介绍
在我们刚开始接触前端，对html中的元素添加样式时，往往会给元素设置id选择器，添加id的样式，有时也会使用class选择器，添加class的样式，这两者之间有什么区别吗？今天我们来学习讨论一下！
2.知识剖析
ID，是identity的缩写，意为身份。具有唯一性，可以类比人的身份证件号。用于标识特殊用途的元素。web标准规定在同样的网页中只能应用一次，不可重复使用同样的ID名。
在使用过程中，它这样表达：
class，被成为“类”，在html中，class用于指定元素样式的方法。可以类比成衣服，它具有普遍性，可以对多个元素进行引用。还可以对同一个元素引用多个类选择器。
它不能在以下 HTML 元素中使用：base，head，html，meta，param，script，style 以及 title。
在使用过程中，它这样表达：
第一点，二者的表述方法不同。
第二点，id用于充当label标签for属性的值：示例：
第三点，单就在css样式表中设置样式这一点而言，两者都可以实现。但是在给元素引入样式的过程，稍有区别：id是先找到结构/内容，再给它定义样式；class是先定义好一种样式，再套给多个结构/内容。
第四点，二者的优先级不同，ID的优先级要高于class的。ID权值是100，class权值是10。
第五点，二者在javascript当中使用，作为获取元素节点的方法的时候，也有区别。通过getElementById将返回一个给定id属性值的元素节点的对象。而getElementByClassName返回的是一个具有相同类名元素节点的数组。
3.常见问题
问题: id和class的优先级？
4.解决方案
这里要引入一个简单的案例向大家演示一下。参见编码实战的链接。
5.编码实战
http://119.10.57.69:880/ptt246/littleclass/css-03-difference%20between%20ID%20and%20CSS/demo.html
6.扩展思考
问题: ID和class还有哪些区别？
7.参考文献
参考一：HTML name、id、class 的区别：http://www.cnblogs.com/polk6/archive/2013/05/28/3101571.html
参考二：Diary的博客：css中id和class 的区别：http://blog.sina.com.cn/s/blog_622e55fa0100te43.html
参考三：css样式中的class，style与id的优先级问题：http://blog.csdn.net/baitaibai/article/details/54561918
参考四：知乎：https://www.zhihu.com/question/19550864?sort=created
8.更多讨论
讨论点：name属性和id的区别？
简单说就是名字和身份证件号码的区别。参见：http://www.jb51.net/web/22216.html
返回列表
评论