Date:--/--/-- --:--
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
Date:2008/11/29 03:45
2013/1/28 サーバーを引っ越しました。お手数ですがブックマークし直してください。ついでにscriptタグとHTMLコメントを除外できるように機能もアップしてますから!

必要に駆られてタグの閉じ忘れを簡単にチェックするブックマークレットを作ってみた。
ほんとに開いたタグの閉じ忘れしか検出できなくて、たとえば開いてないのに閉じてるタグとか、閉じタグと開きタグが互い違いになっちゃってるとこの検出とかはなにもやってない。(11/29現在)11/30 New! 出来るようになりました
機能
ブックマークレットを実行すると
・タグの閉じ忘れを検索する
・開きタグがない閉じタグを検索する
・親より先に閉じちゃってる子がないか検索する
・タグ対応エラーの一覧と、ソースコード中のハイライト表示
以上。たったこんだけのことをやるツールが意外と無かった…いや、あるけど。W3Cツールじゃいかんのかと。でももっと素早くさっさとチェックする必要が…ごめん。ただ作りたかっただけ。
他のツールを調べてみたけど…
HTMLの閉じ忘れをチェックできる「Page Scanner Tool」:phpspot開発日誌これよりはずっとイイ!よね!ちゃんと閉じてるタグの数とかどうでもいいもんね。
制限
最初innerHTMLを解析しようとしたら、閉じ忘れたタグを適当に補完してくれたHTMLを返してきてて意味がなかったので、一度XHRで読み込み直してるため、制限が。
・POSTで生成された画面とか、ランダムに変化する画面とかでは使えません。
・UTF-8以外のページではソースが文字化けします。(誰か助けて)
あと、造りの問題による(根気と暇不足による)制限が。
・
SCRIPT中の"</div>"とかの文字列が無視できません2013/01/28 New! 出来るようになりました
・いまんとこのコードでは同じところを何度も何度も走査するので巨大HTMLだと遅いかも。
お約束
このブックマークレットは、
http://tkr-net.tk/tagcheck/tagcheck2.jsを動的に読み込んで実行します。
このスクリプトは現在は特に悪いことしてないと思いますが、急に僕が悪気を起こして利用者の個人情報をぶっこ抜くスクリプトに書き換えちゃわないとも限りません。もしかしたら僕のFC2アカウントがクラッキングされてスクリプトを置き換えられちゃうかもしれません。
そんなわけで、例えば個人情報リストを表示してるような画面で利用することは避けて下さい。
もしくは、現時点のスクリプトをダウンロードして、自分が信頼するサーバーに置いて使ってください。
インストール
タグ対応をチェック←このリンクをブックマーク
WinXP, Firefox3, IE6で一応うごいてました
12/1追記 スクリプトの場所を替えました。これでちゃんと動くはずなのでブックマークし直してください。
12/2 追記 この記事アクセス少ないなあ…けっこうイイと思うんだけどなあ。
12/15 追記 ポップアップブロックにひっかからないようにしました。ブックマークレットをブックマークしなおしてください。
2013/1/28 サーバーを引っ越しました。お手数ですがブックマークしなおしてください。加えて、コメントとscriptタグの中身を無視できるようになりました。
この記事に対するコメント
あのー
使い方が今ひとつわからないのですが、
これをどうやったらブックマークできるのでしょうか。
リンクを右クリックして、IEなら「お気に入りに追加」、Firefoxなら「このリンクをブックマーク」を選択してください。
このブックマークレット、とっても便利です。
こういうのがなかなかなくて探してました。
ヒットが少ないのは、恐らく検索キーワード的に「タグ 閉じる チェック」とかではなかなか出てこないからでは無いでしょうか・・・
なるほど、「閉じる」ってキーワード、確かにないですね。「閉じ忘れ」だとGoogleで上位に出るんですけどね。
いや、これ、マジですごい便利ですよ。感謝しています!!!
使い方はわかるんですが、そこをどうやって修正すればいんですか?
管理ページのHTMLを見ても244行もあるかどうか・・・
使い方はわかりましたが、その行を見つけるのは自力なんですよね?
なにか見つけるコツないんですか?
初心者ですが、害すこと言ったのなら誤ります。
ですがよろしくおねがします。
>イツルギさん、アキさん
修正の仕方、閉じタグを書くべき場所については、ツールではわかりません。コツとしてはHTMLをきれいにインデントして整理して書くぐらいじゃないかと思います。
管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
便利なツールつかわせていただいています!
以下のコードで、pタグが閉じていないといわれるのですがなぜでしょうか・・・。
<p>
<object>
<param />
<param />
</object>
</p>
ちょっと修正しました。直ったかもしれません。
とても見やすく便利です。活用させていただいてます。
IE用の条件付きコメントにも対応してはいかがでしょうか。
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
↑このような場合に、「残念、3個のタグがきちんと対応していません。」と出力されます。
ryoccさん
なるほどー
って、どの場合に対して判定すればいいか決められないですねえ・・・
<!-- ~ -->を全部無視するようにすればいいのかもしれないですねー。
<!--と-->で囲まれた位置の配列を作って、開きタグや閉じタグを見つけた場所がその中にあったら飛ばす、みたいな感じでできそうです。
いずれ対応するかもしれません。そのときは<script>内も無視出来るようになっているはず。
どなたか対応してくださってもよいですー
非常に助かっています。ありがとうございました。
すごい!いつもかなり探しても見つからなくて苦労してました。
本当に助かります、ありがとうございます。
DWを使ってるので、行数も探しやすくていい感じです。
ただ、タグ対応が完璧なはずなのに、DWの画面の表示がおかしいのは、DWのせいだろうか?
管理人のみ閲覧できます
このコメントは管理人のみ閲覧できます
承認待ちコメント
このコメントは管理者の承認待ちです
承認待ちコメント
このコメントは管理者の承認待ちです
承認待ちコメント
このコメントは管理者の承認待ちです
承認待ちコメント
このコメントは管理者の承認待ちです