对于该仿真项目的疑惑
来源：3-1 课程总结
今天也要加了个油
2020-11-04 19:07:22
具体遇到的问题
本项目学完了，收获不少，同时也累积下来了几个问题：
-
关于
img标签和background-image
项目里面很多地方用了 img 标签， 它不如直接使用 background-image 来得方便。比如 index.html 头部采用 header > search-bar + header-img 的结构而不是直接对 header 用 background-image；再比如商家列表中 图片被单独拎出来了，也没有使用 background-image，background-image对性能不友好吗？
另外，了解到 img 的规范写法包含src, width, height, alt，其中 width 和 height，可以给图像预留空间，减少重排，但是这样写，数据写死了，没办法适配啊，只能换种写法吗？ -
库的引用
本项目是一个移动端项目，应该更适合轻量级的 zepto，为什么用 jquery 而不使用 zepto，是因为考虑兼容性还是因为这只是讲课内容所以不用那么严苛？CDN 上的 zepto.js 不包含 touch.js、data.js 等模块，模块引入只能下载下来然后本地引入吗？ 有没有办法能够使用自定制模块后的 CDN 。 -
书写规范
DOM 结构比较复杂的时候，类名如果用到了下划线或者短横线，那么下划线或短横线超过几个算是不规范？记得前面老师提过，选择器是从右边往左边找的，那么似乎直接用一个长类名是优于后代选择器的。 -
样式默认值是否有写的必要？
我感觉这些是冗余的代码，比如 设置白色背景、块级元素宽度设置100%、flex-direction:row 等等。是否应该遵循“能不写就不写”的原则？ -
1px 边框问题中的 1px 指的是设备的一个物理像素点的宽/高吗？关于 1px 边框的问题，我暂且想到的办法是 flexible.js 或 transform 的 scale 或 box-shadow，一般是怎么解决 1px 的边框问题的？
-
pageshow 事件之前没有学过，接触这个项目才知道的。里面一般会做哪些功能？ 举个栗子，我把 “找到当前 html 页面 的的名称 page, 并激活相应的选项卡” 这个功能放在了里面，这样个合理吗？
1回答
-
同学你好，问题解答如下：
1. background-image对性能没有多大影响，大多数结构都使用img，一是为了便于后期更改图片，二是实现需求时使用img更方便。比如附近商家，每一个商家的展示图片都不同，使用background-image不好实现，如果换成img，我们直接渲染img就可以了，相对来讲，使用img要比background-image更容易。再比如头部的head-img，这张图片可能会随时更改的，那么简单的做法就是我们利用img动态渲染该图片，这样后端人员只要将图片的路径改了，前台页面就会跟着改变。
即使img可以在行内设置width等属性，一般情况下，我们也不会这样写，一是数据是写死的无法适配，二是样式写在行内，不好修改。所以建议将img的样式，写在css中，利用css代码来调整它的样式。
2. zepto的语法与jquery相比，几乎没有多大差别，实际开发中，还是使用jquery的时候比较多，因此项目中采用的是jquery，只要jquery学会了，zepto也就会了。因此选择jquery，只是考虑了实际开发中的情况，与兼容性无关。
CDN上的内容，也是管理人员先传上去并对外开放，我们才能使用。因此，如果CDN上没提供模块化的代码，我们是没办法使用的。建议到zepto的官网上，将代码下载到本地使用。另外，使用CDN并不是特别好，如果CDN上的资源被删了，那我们的项目也就没办法运行了，所以还是建议将内容下载到本地使用。
3. 类名规范中，只要求了类名要符合命名规范，比如不能使用数字开头等，除此之外，类名的长度没有要求，下划线的个数也没有要求。
长类名是比后代选择器性能好些，因为它可以直接定位到元素，但是现在浏览器的性能非常好，类名带来的性能问题，可以忽略，所以不用过于考虑类名的性能问题。
4. 非必要样式到底写不写，没有严格的规定，可以根据个人习惯来定，有些人就喜欢写上这些样式，而有些人就喜欢让代码最简，能少写就少写，所以同学可以自行决定写还是不写。
5. 1px边框问题是指在页面上设置的1px，与设计稿上的1px看起来不一样，它与物理像素有关，但不能简单理解成1个物理像素点的宽高。移动端适配的课程中，讲了利用dpr、结合rem来解决1px问题：
同学可以再回顾一下。6. pageshow事件是窗口出现在当前屏幕时触发，即将页面切换到前台时触发，里面可以做重置元素样式、尺寸等操作，比如pageshow事件触发时，我可以让某个元素样式改变。同学的功能也可以放在里面，也是合理的。
祝学习愉快！
0
相似问题