プロが教える店舗&オフィスのセキュリティ対策術

javascript側で、タグを作っておいて、それをinnerHTMLで出したいと思っています。
たとえばなんですが、
htmltag +='<div class ="test">';
xxx.innerHTML = htmltag;
のようにした場合、出力されたソースを見ると、ダブルクォーテーションが
消えてしまい、<div class =test> となってしまい、困っています。
&quot;に置き換えると、今度は<div class ='"test"'>と、何故かシングルクォーテーションが
付与されてしまいます。

うまくスタイルシートが適用されないので、解決方法を教えていただけないでしょうか。
宜しくお願いします。

A 回答 (3件)

HTMLではクォーテーションマークで属性値を囲むことは必須ではないので、


 <div class ="test">
でも
 <div class =test>
でも同じです。
スタイルシートが適用されない理由は別にあり、クォーテーションマークが消えることとは無関係です。


また、innerHTMLで参照できる内容は
ソースコードそのものではなくブラウザが解釈した結果ですので
代入した値がそのまま読み出せるなどという期待はできません。

例えば、以下のコードでアラートされる文字列は、
body要素内に記述されているソースコードそのものにはならない場合があります。

<html>
<head>
<script>
window.onload = function(){
alert(document.getElementById("aaa").innerHTML);
}
</script>
</head>
<body id="aaa">
<div class="test"></div>
< > &
</body>
</html>
    • good
    • 0

とりあえずIEの場合シングルクォーテーションとダブルクォーテーションの


相性がよくないようですね
#1さんも指摘されていますがエスケープしたクォーテーションで処理すれば
いけそうです

<style>
.test1{color:red;}
.test2{font-size:2em;}
</style>
<div id="xxx">hoge</div>
<script>
htmltag ="<div class=\"test1\">fuga</div>";
alert(htmltag);
document.getElementById("xxx").innerHTML=htmltag;
alert(document.getElementById("xxx").innerHTML);
htmltag ="<div class=\"test1 test2\">piyo</div>";
document.getElementById("xxx").innerHTML=htmltag;
alert(document.getElementById("xxx").innerHTML);
</script>

この回答への補足

回答ありがとうございます。
htmltag ="<div class=\"test1\">fuga</div>";のように書いても
同様で、やはり消えてしまうのです…。

補足日時:2011/06/14 15:20
    • good
    • 0

エスケープシーケンスを使いましょう

この回答への補足

\で合ってますよね。それを用いても消えてしまうのです。

補足日時:2011/06/14 13:22
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!