htmlで属性の付け忘れ防止の警告（開発時用） #jQuery

jQueryを使い、開発時に、htmlで特定の属性（ここではmaxlength)を付け忘れた要素が存在する場合に警告を表示します。
サーバー側で、開発モードでのみスクリプトがクライアントで生成されるようにすればきっとよりよいでしょう。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>htmlで属性の付け忘れ防止の警告（開発時用）</title>
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet">
        <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/themes/ui-lightness/jquery-ui.css">
</head>
<body>

    <h4>htmlで属性の付け忘れ防止の警告（開発時用）</h4>
        <label for="date1">maxlengthあり</label>
        <input type="text" value="123" name="hasMaxlength" maxlength="3">
        <label for="date2">maxlengthなし</label>
        <input type="text" value="12345" name="withoutMaxlength">

        <hr>
        <div id="warningAlert" class="alert alert-warning"></div>
    <!-- script -->
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
    <script>
        $(function(){
            var $target = $("input").filter("input:text:not([maxlength])");
            if (0 < $target.length){
                $target.css("background-color","pink");
                $("#warningAlert").text($target.length + "個のmaxlengthがないテキストボックスが存在します。");
            }
        })
    </script>
</body>
</html>