给前端一些建议

最新推荐文章于 2024-04-30 10:53:57 发布

铭毅雨

最新推荐文章于 2024-04-30 10:53:57 发布

阅读量698

点赞数 1

分类专栏：前端

本文链接：https://blog.csdn.net/shua67/article/details/96423501

版权

前端专栏收录该内容

2 篇文章 0 订阅

订阅专栏

公司不再招前端了,找其他人兼职了,说在做的时候有啥建议.想了想这么多年跟前端合作,有一些心得,前端在实现功能时能按要求来,对于后续人员会很方便一些.

1.命名规则,不可用a,b,c,尽量采用业务相关的，例如 id="txtUserName" txt表示是文本框。 btnSel btn表示是按钮。

尽量看见名字就能知道用途的原则。

2.整体结构清晰，一个模块一个模块包在一起。

例如：

<!--头部 开始-->

..html..

<!--头部 结束-->

<!--循环体 开始-->

...html实现

<!--循环体 结束-->

<!--脚本1实现 开始-->



<!--脚本1实现 结束-->

3.整体结构,引用的在 head中,脚本在 </body>之前实现,如果很多建议新建一个js文件实现。

meta要做到电脑端或手机端的适配

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

<meta name ="apple-mobile-web-app-capable" content="yes">

<meta name="apple-mobile-web-app-status-bar-style" content="black"><meta name="format-detection" content="telephone=no">

<title>清除cookie</title>

<meta charset="utf-8" />

<script src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>

<script src="http://apps.bdimg.com/libs/jquery.cookie/1.4.1/jquery.cookie.js"></script>

</head>

<body>

html的实现

<script type="text/javascript">

本页面的一些脚本逻辑实现

</script>

</body>

</html>

4.每个业务可单独建一个文件夹,每个页面自己部分的脚本和样式也区分开来

例如：新闻模块

news

--html页面

--index.html

--list.html

--detail.html

--js

--index.js

--css

--index.css

--list.css

5.公共部分可放一个目录，供其他模块调用

common

--html

--_Layout.html(这块可能你们抽取不了,不是必须要求,但是如果是在页面中,最好备注这块是公共部分)(母板)

--js

--utils.js

--head.js

--foot.js

--css

--common.css(一些所有页面都需要之类的等)

--head.css

--foot.css