ぼくがかんがえたWebシステムのコーディング規約

4592 ワード
firefox JavaScript IE11 JavaScript テキストリンク

数人でWEBシステムを開発しています。
プロジェクトには特にコーディング規約というものはありません。
現状のソースに倣ってコーディングしていきます。
規約はありませんが、暗黙的に守れているものはあるので、それらを文書化したいと思います。
随時追加していきます。

対象ブラウザ

  • Firefox
  • IE11

JavaScript

DOM要素のIDを渡すUtilメソッドは、DOM要素自身も渡せるようにする。

DOM要素も渡せた方が、getElementByIdの実行回数が減ります。

/** セレクトボックスにオプション要素を追加するサンプルコード */
U.addOption(select, value, text) {
  if (typeof select === "string") {
    select = document.getElementById(select);
  }
  //セレクトボックスにオプション要素を追加する処理
};

XSS対策

HTMLタグを認識させないさせないよう、innerHTMLでなくtextContent, またはdocument.createTextNodeで文字列を設定する。

HTML

参考サイト
http://niwakasoft.jp/column/coding_conventions/
http://www.hp-stylelink.com/news/2013/10/20131001.php

HTMLの文字コードはUTF-8

今の時代当たり前だとは思いますが、念のため。

<meta charset="UTF-8">

IEでの互換表示対応

IE8~IE11では「互換表示」という過去のバージョンで表示できる機能があります。
「常に最新のバージョンで表示する」よう設定しましょう。
https://msdn.microsoft.com/ja-jp/library/cc288325.aspx

<meta http-equiv="X-UA-Compatible" content="IE=edge" >

headタグ内で、metaタグは先頭に記述する

metaタグの中でも、文字コード、"X-UA-Compatible"は先頭に記述してください。
ブラウザのページ解析に影響を与える要素だからです。
https://blogs.msdn.microsoft.com/ie_jp/2011/10/03/head/

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge" >
  <meta ...><!-- その他のmetaタグ -->
  <!-- 他のタグ -->
</meta>

HTML文字参照は、< > " &以外使わない

文字コードがユニコード形式なら、機種依存文字なども表現できるので、HTML文字参照を使う必要はありません。また、連続した半角スペースを使いたいときは、CSSプロパティのmargin, paddingを使いましょう。

https://www.marguerite.jp/Nihongo/WWW/Introduction/HTML5/Entity.html
http://wolfrosch.com/text/2013/10/13
http://stackoverflow.com/questions/3593024/html-character-entities-and-character-encoding-set

php csvファイルの読み取り、書き込み、出力ダウンロード操作の詳細
Jekyllは静的ブログサイトを動的に構築した(Get Started)