zoukankan      html  css  js  c++  java
  • 用Inline Code Finder检查一下你的HTML代码吧!

    在很长一段时间以来,快速开发和易于维护是相互冲突的,但是如果你可以遵照一些标准 和规范来进行开发,在很大程度上可以保证鱼和熊掌兼得,但遵守标准本身就很难。尤其是一些短小的代码,可能一着急就会把他们内联到HTML中,只要一个两 个可能看不出来,但假如有几十个上百个,你还会认为易于维护么?

    【扩展名称】Inline Code Finder
    【扩展作者】Robert Nyman
    【下载地址】https://addons.mozilla.org/firefox/addon/9641



    Inline Code Finder是一个Firefox扩展,有两个版本,一个是独立的,一个是Firebug版本,功能都一样,本文介绍的是Firebug版本,目前最新版 本是0.90,2008年12月17日发布,只有9KB大小,兼容于Firefox 2.0 - 3.1b2pre。Inline Code Finder可以帮你找出网站中那些让人看着恼火的内联代码,帮助你快速改进。

    内联代码?

    第一个是内联的样式(Inline style),已经经过很多很多人的亲身实例证明,直接设置HTML元素的style属性是非常不容易维护的做法。成熟的做法应该是根据id或者class属性,通过head或者外部的CSS文件来设置样式。

    第 二个是内联的JavaScript事件(Inline JavaScript events),比如直接在HTML元素的onclick内书写代码,这是非常典型的把表现层和行为层分不开的表现,对于某些简单的操作,这样做可能显得 非常方便,但是代码冗余加上不利于维护的问题,似乎更加严重。

    第三个是在链接的href属性中直接编写javascript代码,达到点链接就执行相应操作。其实链接有click事件,不是么?

    简单的使用说明

    安装扩展以后,在Firebug上就会多出一个Tab:Inline Code Finder。点击这个Tab,在上方可以执行四个操作:
    Run:对当前页面执行测试,并在页面用不同颜色显示出来。内联事件为红色、内联样式为绿色、JavaScript链接为紫色。鼠标移动到颜色框内,会显示出内联的代码。
    Toggle:在显示测试结果和不显示测试结果两个状态间进行切换。
    Clear:清除测试结果。
    Hide:隐藏Firebug窗口。(独立版本应该是隐藏Inline Code Finder窗口)

    设置

    除了可以对是否进行这三项检查,做单独的启动设置外。Inline Code Finder还提供一个自动检查模式,打开的新页面会自动检查并显示测试结果。

    总结

    对于Web开发者来说,这个扩展提供了一个非常实用的功能,基本上属于必备工具。
  • 相关阅读:
    Nginx+Keepalived(双机热备)搭建高可用负载均衡环境(HA)
    库管理系统-- 后台管理开源啦,源码大放送
    .NET Core R2
    Linux gdb调试
    webpack React+ES6
    绿卡排队
    ABP分层设计
    vscode编写插件
    控制台程序的参数解析类库 CommandLine
    Net Core MVC6 RC2 启动过程分析
  • 原文地址:https://www.cnblogs.com/analyzer/p/1386299.html
Copyright © 2011-2022 走看看