一份全面的前端开发规范手册
发布于 24天前 作者 Aaaaaashu 508 次浏览 来自 分享

从去年实习到今年毕业,接触前端已经有一年了,在这个从零到一的过程中不断积累,记录。随着知识的增长,慢慢就攒下这份前端规范手册了。在分享知识和经验的时候,也是对自己的沉淀 🐶。

#####Github: 仓库地址 #####知笔墨:手册地址

目录

附上一只哈士奇 :)

12 回复

不错!善于总结,不吝分享,赞楼主!

简单的看了下,提出几点疑问: 2.1 标签 1

自闭合(self-closing)标签,无需闭合 ( 例如: img input br hr 等 );

有的编辑器会在做语法检查的时候报错,就是因为闭合标签,比如在用 jshint 检查 jsx 的时候。

2

<!-- Not recommended -->
<div class="j-hook left contentWrapper"></div>
<!-- Recommended -->
<div id="j-hook" class="sidebar content-wrapper"></div>

在写js的时候需要添加一些代码块,那个时候写代码就变成了

var str = "<div class='aaa'></div>";

如果属性多了简直不能看。

3 嵌套

a 不允许嵌套 div这种约束属于语义嵌套约束,与之区别的约束还有严格嵌套约束,比如a 不允许嵌套 a a 嵌套 DIV 为什么不可以?在有些场景的时候,非常好用啊,而且只是一个标签而已。

@nunnly

规范只为了统一和优化

1、jsx 不太熟悉,应该不算是 HTML 标签? 2、不是很明白,但上述的意思,主要是语义化和规范 class 命名 3、语义嵌套上不允许,并不是严格嵌套约束。如果是 <p> 里就不能包含 <div>,就算严格嵌套约束。另外用 <a> 嵌套 <div> 的方案,可以用 <a>标签绝对定位,填充整个 <div> 的方式实现,满足语义和严格嵌套。

避免使用 jQuery 实现动画

这个是为啥原因啊?

Less嵌套深度限制在2级,超过3级影响阅读。 写通用的样式库没问题,实现具体页面的具体样式肯定要深度嵌套的吧,防止互相干扰。

@Hanggi 嗯,具体业务的嵌套的确会更多,可以考虑参考 模块组织,做些处理。

不错哦…值得学习

来自炫酷的 CNodeMD

好东西,先马回去看

来自炫酷的 CNodeMD

回到顶部