发表于: 2018-06-07 22:02:28
1 566
今天完成的事情:
1、重新写页面一,之前的导航栏和轮播图是从bootstrap复制过来的,都有js的痕迹在里面,自己实际并不太清楚导航栏和轮播图其中的原理,干脆重新用css写一遍。
明天的计划:
1、完成轮播图后,开始基础的页面重构阶段。
遇到的问题:
1、导航栏。
导航栏缩小时点击按钮下拉单如何顺利下拉出来。
开始用hover+focus,想通过伪类事件来实现,可是实现不了,原来是元素层级出了问题,如果hover触发元素与被触发元素不是在同一个父元素下面,那么hover值不起作用。所以重新调整元素层级关系就成功实现了。
但是hover+fovus有一点不好,只能点开不能点击回去。
所以我用checked元素做了一遍,这次效果比较理想,与之前js版本效果无异。
收获:
1、checked的使用。
checked 属性规定在页面加载时应该被预先选定的 input 元素。
checked 属性 与 <input type="checkbox"> 或 <input type="radio"> 配合使用。
checked 属性也可以在页面加载后,通过 JavaScript 代码进行设置。
2、json格式。
什么是 JSON?
JSON 英文全称 JavaScript Object Notation
JSON 是一种轻量级的数据交换格式。
JSON是独立的语言 *
JSON 易于理解。
JSON 使用 JavaScript 语法,但是 JSON 格式仅仅是一个文本。
文本可以被任何编程语言读取及作为数据格式传递。
JSON 格式化后为 JavaScript 对象
JSON 格式在语法上与创建 JavaScript 对象代码是相同的。
由于它们很相似,所以 JavaScript 程序可以很容易的将 JSON 数据转换为 JavaScript 对象。
JSON 语法规则
- 数据为 键/值 对。
- 数据由逗号分隔。
- 大括号保存对象
- 方括号保存数组
JSON 数据 - 一个名称对应一个值
JSON 数据格式为 键/值 对,就像 JavaScript 对象属性。
键/值对包括字段名称(在双引号中),后面一个冒号,然后是值:
JSON 对象
JSON 对象保存在大括号内。
就像在 JavaScript 中, 对象可以保存多个 键/值 对:
JSON 数组
JSON 数组保存在中括号内。
就像在 JavaScript 中, 数组可以包含对象:
在以上实例中,对象 "sites" 是一个数组,包含了三个对象。
每个对象为站点的信息(网站名和网站地址)。
JSON 字符串转换为 JavaScript 对象
通常我们从服务器中读取 JSON 数据,并在网页中显示数据。
简单起见,我们网页中直接设置 JSON 字符串 (你还可以阅读我们的 JSON 教程):
首先,创建 JavaScript 字符串,字符串为 JSON 格式的数据
进度:task14,15
任务开始时间:2018.6.5
预计结束时间:2018.6.8
是否有延期风险:无
禅道:http://task.jnshu.com/zentao/project-task-717.html
评论