有哪些经常被误用的 HTML、JavaScript、CSS 的元素、方法和属性?

以前想要把一个元素(input 之类的)设成只读的时候都是用 disabled,后来发现这是不对的。 因为在 HTML 里面,如果一个元素被设置成 disabled, 那么它的值就不会被发送到 server 端。 正确的做法应该是使用 readonly。 那么除了这个 disabled,在 Web 开发中还有哪些东西是经常被误用的?
关注者
3167
被浏览
197657

24 个回答

泻药!
仅说一下 CSS 方面的吧。

  1. float:left/right 或者 position: absolute 后还写上 display:block,画蛇添足(三者关系:Visual formatting model

  2. 不分场景的使用 overflow:hidden 来闭合浮动(详见:那些年我们一起清除过的浮动

  3. 为了让 Chrome 这个脑残支持小于12px 的文字,在 html 设置 -webkit-text-size-adjust:none; (最新的桌面版该属性已经被删除了,变更集:Changeset 145168)
  4. 认为 px 是一个绝对单位(px 是相对单位),整个页面都是 px,line-height 也用 px,全家都是 px

  5. 习惯性不分场景的去除 a 标签 focus 时候的焦点
  6. 认为布局就是 Float,所有的地方都是 Float,全家都是 Float!(试试 inline-block inline-block 前世今生 吧,试试 Flexbox 吧)
  7. 满页面都是用 .clearfix 来闭合浮动,如果已经有了BFC为嘛还要在闭合浮动呢?毒害不浅,某浪微博为例,102个 .clearfix


好吧我还是说点其他的吧:
  1. 搞不拎清 PNG 的分类,认为 PNG24 支持透明,不知道 PNG8 也支持 α 透明(可以看看:PNG的秘密
  2. 我又要吐槽 Label 不加 for ,或者 for 属性加的不对的问题(请看:雅安地震,前端开发者可以做什么?
  3. 看到@贺师俊老湿说道 ul,ol 滥用的问题,我举一个本来应该用 ol 却写成 ul 的例子:
    首页 | 微吧 一起扎堆吧!找反面教材,都去渣浪吧,渣浪你承认不?

  4. 查看源码,满屏都是 div 的就不多说了吧……
好吧,我已经原谅你们了,或许你遇到了学习瓶颈:
图片来源:《CSS 进阶之路》skydrive.live.com/?

延伸阅读:在 CSS 布局中,用 float 好还是用 position 好?分别有什么优势?

以上都是片面或者不对的!
一丝
【Update】
写了 xhtml 的 doctype,但是文档连 well-formed 都没做到。比如渣浪微博。腾讯原来也是,不过最近似乎改好了。
【/Update】

几乎每个 HTML 标签都可能被用错,TABLE布局这种我就不说了,下面挑在各互联网大站屡见不鲜的说:

元素方面
1. 滥用 UL、DL
2. 该用 OL 的用 UL
3. 段落不会用 P 只会用 BR 和 DIV
4. 不会用 H1 / H2 / H3 ... 只会用 STRONG 甚至 DIV
5. 不会用 LABEL、FIELDSET、LEGEND
6. 乱用 ABBR、CITE、Q 之类比较少见的标签
7. 不会用或乱用 B / I / S / U 之类在 HTML5 中重新定义过的标签
属性方面
1. 多 class 症(病入膏肓的表现就是几乎每个元素上都有不止一个 class)
2. IMG 的 alt 属性没有意义(比如和title属性一样)
3. 混淆 INPUT 的 disabled 属性和 readonly 属性
4. LABEL 元素的 for 属性
5. 不会使用 lang 属性或 lang 属性写成 zh-CN 等已经废弃的用法
为什么?