Changes between Version 12 and Version 13 of HowTo/JavaScriptTutorial

Timestamp:

Jun 18, 2010, 11:54:20 PM (14 years ago)

Author:

村山 俊之

Comment:

--

HowTo/JavaScriptTutorial

@@ -508 +508 @@
 === DOM を扱う ===
 
-実は、画面表示に関してのみいうのであれば、理論的には先ほどの innerHTML 属性だけであらゆる操作が可能です。そして、実際のところ、 innerHTML でできることは何でもかんでも innerHTML でやってしまおう、という考え方の Web プログラマーも、少なくありません。
+実は、画面表示に関してのみいうのであれば、理論的には先ほどの innerHTML 属性だけであらゆる操作が可能です。そして、実際のところ、画面表示の操作は何でもかんでも innerHTML でやってしまおう、という考え方の Web プログラマーも少なくありません。
+
+しかし、 innerHTML を用いる方法はあまりにも原始的である為、それを補う為には、プログラミングの際に以下の点に気をつける必要があります。
+
+ 1. innerHTML に HTML を代入する場合、その HTML の文法に誤りがないよう気をつける必要がある。
+ 2. 外部から入力した文字列を表示する場合、 HTML タグ等に誤解されないよう、 HTML マークアップ用の文字 (「<」、「>」、「&」、「"」) を実体参照 (「&lt;」等) に変換する必要がある。
+ 3. ある要素の innerHTML 属性に代入した HTML 要素の配下にあとから HTML を記述したい場合、その要素を document.getElementById() で取得できるようにあらかじめ id 属性付きで記述しておく必要がある。
+
+これに対して、 HTML 文書をオブジェクトのツリー構造に見立てて扱い、操作する方法があります。そのようなモデルのことを、 '''DOM (Document Object Model)''' と呼びます。