out.print 嵌套html代码_代码规范之前端编写码规范

2024-04-28 21:31:30

上一期阿牛ger与大家分享了Niushop开源商城系统model层类名代码规范命名，这期，我们看看Niushop单商户b2c V4前端编码命名规范：

文件目录命名

采用小写+下划线方式，命名要精简，最好用一个单词

例：addon

JS文件命名

采用小写+下划线方式

例：common.js

CSS文件命名

采用小写+下划线方式

例：common.css

HTML文件命名

采用小写+下划线方式

例：index.html

HTML规范

1、缩进使用soft tab（4个空格）；

2、嵌套的节点应该缩进；

3、在属性上，使用双引号，不要使用单引号；

4、属性名全小写，用中划线做分隔符，例：data-name；

5、不要忽略可选的关闭标签，例：</li>和</body>

引用CSS，JS

根据HTML5规范, 通常在引入CSS和JS时不需要指明 type，因为 text/css 和 text/javascript 分别是他们的默认值，可以省略。

css要写在{block name="resources"}{/block}中

例：

{block name="resources"}

<link rel="stylesheet" href="login.css" />

{/block}

js要写在{block name="script"}{/block}中

例：

{block name="script"}

<script>

...

</script>

{/block}

注意：

1. 减少标签嵌套

在编写HTML代码时，需要尽量避免多余的父节点；

尽量遵循HTML标准和语义，任何时候都要用尽量小的复杂度和尽量少的标签来解决问题。

2. 代码分离

HTML、CSS、JS要最大化分离，一个功能对应一个JS、CSS文件，复杂功能除外，如果某个功能img、js比较多，那就单独建立一个文件夹。

每个功能页面中不能有太多内联样式。

阿牛ger说：在开发过程中，代码越简洁越好，讲解简单的代码和文件夹命名，方便查找，出现漏洞能第一时间找出相应代码解决！

out.print 嵌套html代码_代码规范之前端编写码规范相关推荐

java五子棋悔棋代码_小猿圈前端编写JS五子棋游戏
前段时间发的飞机大战的游戏很多小伙伴都私聊让再做个游戏,今天小猿圈web前端讲师为大家分享的是JS五子棋的游戏,想玩的小伙伴记得自己运行一下呦. JS五子棋游戏代码: 五子棋 canvas { dis ...
eclipse git提交代码_来看看大厂的Git提交规范，千万别乱提交代码哦...
点击上方"小黄鸭编程社区",选择"星标" 作者:人人贷大前端技术中心来源:https://urlify.cn/3a6NNb git是现在市面上最流行的版本控制工 ...
python手机充值代码_[代码全屏查看]-加油卡在线充值接口实例
[1].[代码] [Python]代码 #!/usr/bin/python # -*- coding: utf-8 -*- import urllib, md5, json from urllib i ...
苹果手机查看python代码_[代码全屏查看]-基于Python的苹果序列号官网查询接口调用代码实例...
[1].[代码] [Python]代码 #!/usr/bin/python # -*- coding: utf-8 -*- import json, urllib from urllib import ...
Java编写抓取用户信息代码_[代码全屏查看]-一个基于JAVA的知乎爬虫，抓取知乎用户基本信息...
[1].[代码] [Java]代码作者:卧颜沉默链接:https://www.zhihu.com/question/36909173/answer/97643000 来源:知乎著作权归作者所有. ...
python小猪代码_代码绘制一只小猪佩奇---python篇
今天教大家用python的pillow包来绘制小猪佩奇,python的安装就不用多说了,直接上代码吧 0.首先当然是安装pillow包啦. 关于pillow库的安装有几种方式最常使用的是pip安装 ...
inno setup插件可选安装代码_代码检测工具（sonar docker方式安装）
sonarqube 是一个代码质量检测工具,内置很多有用的Java规范,使用sonar检测工具,能够帮助开发者写出干净和安全的代码,让初级开发者也能写出高水平代码安装地址:https://docs. ...
cnn 预测过程代码_代码实践 | CNN卷积神经网络之文本分类
学习目录阿力阿哩哩:深度学习 | 学习目录zhuanlan.zhihu.com 前面我们介绍了:阿力阿哩哩:一文掌握CNN卷积神经网络zhuanlan.zhihu.com阿力阿哩哩:代码实践|全连 ...
python做项目管理代码_代码发布项目(三)——python操作git、代码发布流程（服务器管理、项目管理）...
一.python如何操作git 如果你想用python代码操作git需要下载一个模块安装 pip install gitpython 基本使用 #从远处仓库下载代码到本地 importosfrom ...
python处理excel代码_[代码全屏查看]-python处理Excel文件
[1].[代码] test_xlrd.py #coding=utf-8 ####################################################### #filenam ...

最新文章

热门文章