发表于: 2018-09-22 21:50:09

1 730


今天完成的事情:

1.昨天js任务一大致做完,后来师兄给提了一个bug:随机的颜色会重复;今天早上修改了一下代码,加了一个判断,判断随机获取的颜色与之前是否相等或者等于九宫格原本的颜色,如果相等,则重新获取。跑了几遍程序,发现就算是加了判断但还是有看起来差不多的颜色,(值不同,但眼睛分辨不出了)又想了另一个方法:设一个颜色数组,里面的颜色相差较大,在颜色数组中随机取三个,添加给随机选出的三个格子。

2.看了任务二的要求,先做了静态页面。
明天计划的事情:明天继续做任务二。 
遇到的问题:修改input[range] 样式,百度了一下,经过自己的理解,主要是修改input[type=range]和input[type="range"]::-webkit-slider-thumb样式;第一个主要是控制进度条的样式,第二个是控制滑块的样式。修改和psd样式相同即可。
收获:

1开发过程中应该遵守哪些编码规范和class命名规范?

html规范

页面的第一行添加标准模式声明!DOCTYPEhtml

代码缩进:tab键设置四个空格(通常在软件右下角设置相应空格大小)

html中除了开头的DOC和'UTF-8'或者head里特殊情况可以大写外,其他都为小写,css类都为小写

建议为html根元素指定lang属性,从而为文档设置正确的语言lang="zh-CN"

不同doctype在不同浏览器下会触发不同的渲染模式

非特殊情况下样式文件必须外链至…之间;非特殊情况下JavaScript文件必须外链至页面底部

尽可能减少div嵌套.

在页面中尽量避免使用style属性,即style="…";写在相应的样式文件中

对于属性的定义,确保全部使用双引号,绝不要使用单引号

背景图片请尽可能使用sprite技术,减小http请求

给区块代码及重要功能(比如循环)加上注释,方便后台添加功能

不要使用@import,与<link>标签相比,@import指令要慢很多,不光增加了额外的请求次数,还会导致不可预料的问题。

css规范CSS书写顺序

显示属性:display/list-style/position/float/clear…

自身属性(盒模型):width/height/margin/padding/border

行高:line-height

文本属性:color/font/text-decoration/text-align/text-indent/vertical-align/white-space/content…

其他:cursor/z-index/zoom/overflow

CSS3属性:transform/transition/animation/box-shadow/border-radius

如果使用CSS3的属性,如果有必要加入浏览器前缀,则按照-webkit-/-moz-/-ms-/-o-/std的顺序进行添加,标准属性写在最后

class命名

规则命名中,一律采用小写加中划线的方式,不允许使用大写字母或_

命名避免使用中文拼音,应该采用更简明有语义的英文单词进行组合+

不允许通过1、2、3等序号进行命名;避免class与id重名

class用于标识某一个类型的对象,命名必须言简意赅

尽可能提高代码模块的复用,样式尽量用组合的方式

规则名称中不应该包含颜色(red/blue)、定位(left/right)等与具体显示效果相关的信息。应该用意义命名,而不是样式显示结果命名


2.学习了Input Range 对象

Input Range 对象是 HTML5 中的新对象。

Input Range 对象表示 HTML <input type="range"> 元素。

3.学习了一些jquery的用法

添加方法:

1.下载jquery库

2.从 CDN 中载入 jQuery,

入口函数:

$(function(){

 

   // 开始写 jQuery 代码...

 

});



jQuery 的功能:

1、html 的元素选取

2、html的元素操作

3、html dom遍历和修改

4、js特效和动画效果

5、css操作

6、html事件操作

7、ajax异步请求方式

感觉今天比较浮躁,划水了半天,做的东西也不多,明天还是静下心来做任务吧,放假什么的和自己也没关系。



返回列表 返回列表
评论

    分享到