元アルバイト先に頼まれてサイトを作り運営しているのですが、わからないことがあるので教えて下さい。
サイトはXHTML1.0 Transitional で作っており、ここに、http://fmono.sub.jp/ の「w3Analyzer」を組み込みアクセス解析をしています。サイト自体もこのアクセス解析も正常に動作しています。
ただ、このサイトをhttp://openlab.ring.gr.jp/k16/htmllint/htmllint. …で構文チェックすると、アクセス解析のタグにエラー「<img>を~行目の<script>~</script>内に書くことはできません。」が表示されてしまいます。
エラーが表示されるタグは下記のようなものです。
<script type="text/javascript">
document.write('<img src="http://~/w3a/writelog.php?ref='+document.referrer+'" width="1" height="1" />');
</script> >
アクセスログは普通に取得できているので問題ないのですが、もし上記エラーを回避する方法があればご教授下さい。よろしくお願いします。
No.1
- 回答日時:
document.write('<img src="http://~/w3a/writelog.php?ref='+document.referrer+'" width="1" height="1" \/>');
としたらどうですか?
最後を
/>');
でなくて
\/>');
No.2
- 回答日時:
多分、下記の様な感じ書けば怒られないと思います??
━━Sample::start━━━━━━━━━━━━━━━━━━
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dt …
<html xmlns="http://www.w3.org/1999/xhtml" lang="ja">
<head>
<meta http-equiv="content-language" content="jp" />
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<meta http-equiv="content-script-type" content="text/javascript" />
<meta http-equiv="content-style-type" content="text/css" />
<title>NowRPG-Systemz.</title>
<link rel="index" href="./index.html" />
<link rev="made" href="mailto:aiueo@123.com" />
<script type="text/javascript">
<!--
document.write('<img src=\"http:\/\/w3a\/writelog\.php\?ref='+ document.referrer +'\" width=\"1\" height=\"1\" \/>');
//-->
</script>
</head>
<body>
<p>テストです。</p>
<noscript>
<p>JavaScriptがOFFの時の文書。</p>
</noscript>
</body>
</html>
━━Sample::ebdd━━━━━━━━━━━━━━━━━━
ポイントとしては、
・XHTMLの書式に乗っ取って書くこと。
・JavaScript内の文字列扱いの語句をちゃんとエスケープ処理する事。
~こんな感じでしょうか?
質問文の「<img>を~」とは恐らく。
「document.write('~')」の中の文字列のエスケープ処理がおかしかったからじゃないでしょうか?
別に適当でも動きますが(笑)。
厳密には「/、.、"、'、\、*、-、? (その他演算子)」などは、その文字の前に「\」を置いて“エスケープ処理”をする事が推奨されています。
ですので採点評価サイトなのですから、その辺を厳密に採点してるのだと思います。
後、まさかとは思いますが…。
質問文の「</script> >」は書き損じであって、本物には無いものですよね(文末の“>”が二重)?
P.S.
自分的には…
/、.、,、"、'、\、*、-、? 、=、$、&、%、#、!、(、)、{、}、[、]、<、>、;、:、_、^、~、|、@
~は普段からエスケープ処理する様な癖を付けて置いた方が、後々便利だと思います。
ご回答ありがとうございました。詳しく書いて下さり大変参考になりました。エスケープ処理などわからないことだらけだったのですが、ご回答がきっかけで色々と調べるうちにとても勉強になりました。
結局外部スクリプトにすることで解決しましたが、今後もXHTMLについて一層勉強していきたいと思います。
No.3ベストアンサー
- 回答日時:
XHTML には「ホンモノの XHTML」と「ニセモノの XHTML」があります。
「ホンモノの XHTML」とは application/xml または application/xhtml+xml として識別されるもの、「ニセモノの XHTML」は text/html で識別されるものです。※実際にはどちらも本物です。ここでは「HTML 互換として処理される XHTML」を「ニセモノ」、「XML として解析される XHTML」を「ホンモノ」と、カタカナ&カッコ付きで書いています。
「ホンモノの XHTML」として見れば、質問文のソースは妥当性違反です。なぜなら、img 要素のタグがエスケープされていないため、これがスクリプトの一部ではなく文書構成要素だと判断されるからです。XHTML 1.0 のスキーマは、script 要素内に img 要素が出現することを許していません。もちろん、スクリプトとしても正しく動作しません。
従って、XML のルールに従ってエスケープする必要があります。特に「<」と「&」は必ずエスケープしなければなりません。
document.write('<img .... />');
ですが面倒なことに、「ニセモノの XHTML」ではこれが動作しなくなります。「ニセモノの XHTML」は、HTML との互換性のために script 要素内の「<」「&」をうまく扱ってくれるのですが、それが仇となり、上記では「<」が「<」に戻りません。
ならば、コメント区間にするのはどうでしょう。XML でもコメント内なら「<」「&」が現れても大丈夫です(ただし「--」だけは駄目です)。
<script type="text/javascript"><!--
document.write('<img .... />');
//--></script>
「ニセモノの XHTML」ならこれでも構いません。しかし、「ホンモノの XHTML」では、コメントは本当に破棄されてしまい、上記では動作すらしなくなります。
そこで、XML/HTML のルールを使わず、JavaScript のルールでエスケープすることを考えます。
document.write('\u003Cimg .... />');
これなら大丈夫でしょう。XML/HTML に限らず、言語が混在する際は必ず適切なエスケープを施す必要があります。エスケープを避けたければ外部スクリプトにして下さい。
なお、ここには別の問題があります。そもそも「ホンモノの XHTML」では、document.write を使用できません。これは HTML 互換の機能だからです(HTML5 に明記されています)。
XHTML を採用するのであれば、それが「ホンモノ」でも「ニセモノ」でも大丈夫なよう、document.write に頼らないコードを作成して下さい。あるいは try...catch で括るなどして、「ニセモノ」として処理されたときのみコードが動作するよう工夫して下さい。あるいはいっそ、XHTML を止めるのも 1 つの選択でしょう。
ご回答ありがとうございました。大変参考になりました。エスケープ処理などわからないことだらけだったのですが、ご回答がきっかけで色々と調べるうちにとても勉強になりました。
結局外部スクリプトにすることで解決しましたが、今後もXHTMLについて一層勉強していきたいと思います。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・人生のプチ美学を教えてください!!
- ・10秒目をつむったら…
- ・あなたの習慣について教えてください!!
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・【大喜利】【投稿~9/18】 おとぎ話『桃太郎』の知られざるエピソード
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
カウントダウンとカウントアッ...
-
JavaScriptが有効な場合のみ表...
-
CGIフォーム一定時間過ぎる...
-
リンクのクリック数を把握したい
-
<a href="#" …>の意味を教えて...
-
HTMLソースからURLだけを抜き出...
-
別ファイルのfunctionの読み込み方
-
ポップアップウィンドウの位置
-
(Javascript)印刷するファイル...
-
リンク移動先のURLを取得
-
JavaScriptでiframeの内容を「...
-
$という文字が使えない?
-
背景のグラデーション設置について
-
LYCOS(WiseNut)のプレビュー機...
-
ウィンドウ名の設定
-
フレーム越しの背景色変換
-
テキストボックス内にハイパー...
-
ウインドウの後ろに隠れている...
-
ダイアログメッセージを1度に2個
-
外部JSでサブウィンドウを設定...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
javascriptで変数を組み込みたい
-
document.getElementById
-
キャラクターコード表を出力さ...
-
特定URLからの遷移後、指定ULR...
-
この構文でよいでしょうか?
-
1から100までの平方根を表示す...
-
明日の日にちを表示するときは
-
ホームページを見る度にTOP画面...
-
location.hrefの使用方法について
-
FLASH(swf)2点のリロード毎の切...
-
コピーライトの年表示について...
-
ブログ上で複数のjavaスクリプ...
-
JavaScriptの勉強を始めました。
-
特定のURLからの訪問者を入室禁...
-
'<SCR' + 'IPT>' なぜ分割?
-
JSによるリンク先の値の取得
-
文字の置換について
-
スクロールしても画像・文字が...
-
Java scriptでFLASHを表示した...
-
CGIフォーム一定時間過ぎる...
おすすめ情報