首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

GIS Web前端设计守则

2012-09-02 
GIS Web前端设计规则1.程序员在设计一套前端功能的时候,先不考虑样式!等先把交互功能实现后再讲样式加上去

GIS Web前端设计规则

1.程序员在设计一套前端功能的时候,先不考虑样式!等先把交互功能实现后再讲样式加上去

2.页面先初始化,初始化完页面后再为页面表单元素绑定事件,每个模块的事件在各自的init方法中绑定,

3.程序在初始化的过程中,应该按照优先级,基础的模块先初始化,被依赖的模块先初始化,比如说,配置文件先初始化,然后再初始化UI模块,Ui模块初始化后,再初始化地图对象模块,并且注释后面的模块不会影响前面的模块(注释地图对象模块,不会影响Ui,注释ui和地图模块,不会影响配置文件),所以初始化要有先后顺序。

4.在应用模块中,业务上不相干的两个模块之间,注释其中一个模块,不应该对另一个模块产生影响,比如说,注释地名查询模块,不应该对公交模块产生任何影响,因为他们之间没有业务关系的;

5.对于有关系的两个模块之间,如果注释其中一个模块,对另一个模块可能会产生影响,比如说公交模块,和最短路径模块,他们之间有共用的组件,并且该组件在其中一个模块中

6.列表显示,或菜单显示,可以使用html中的有序列表,或无需列表(必杀技).

7.在css中引入reset.css,是为了让所有的浏览器都引用默认的reset.css中的默认样式,而不是使用浏览器中标签的默认样式,比如说p标签,IE给的默认样式,和火狐给的默认样式可能不一样,那么,我们就需要使用reset.css统一其样式。让默认样式以reset.css为准

8.html元素中,除了表单元素,其他的<label> <p><span>等都是容器,他们的默认样式是不一样的,但是完全可以通过css让他们都具备一样的样式效果,所以他们本质上都是一样的,只是浏览器赋予他们的默认样式不一样罢了!

?

9.在显示结果集时,统一使用模板,这样方面维护,如图层管理的结果列表显示:

?var result = {

????? item: "<li class='m1'>" +
??????????? " <a href='javascript:void(0);' onclick='gotoLayer("${layerid}")'>定位</a></li>" +
??????????? " <li class='m2 hasBorder'><a href='javascript:void(0);'? onclick='opacityWin("${layerid}")'>透明度</a></li>" +
??????????? " <li class='m3 hasBorder'><a href='javascript:void(0);'? onclick='removeLayer("${layerid}")'>移除</a></li>" +
??????????? " <li class='m4'>${moveTop}</li> " +
??????????? " <li class='m5'>${moveUp}</li> " +
??????????? " <li class='m6'>${moveDown}</li> " +
??????????? " <li class='m7'>${moveBottom} " +
??????????? "</li>"

?}

?

10.结果显示,统一使用<ul><li>配合css控制格式

热点排行