人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

javascriptのappendChildでつまづいています。

ieで<body>の子に<div>を入れる、</body>の直前に</div>を入れるjavascriptを教えてください

●質問者: drivingsummer
●カテゴリ:ウェブ制作
✍キーワード:IE JavaScript
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● redcherry
●50ポイント

var pDiv =document.body;

var div =document.createElement(’DIV’);

div.id=’div_id’;

pDiv.appendChild(div);


単独のタグを入れるのではなくて、elementをつくってそれをDOMに追加するようなイメージです。

当然のように</div>を単独で入れる必要はない筈です。


このDIV element内に要素を追加する場合は親がdivなので

var img=document.createElement(’IMG’);

img.src=’http://www.hatena.ne.jp/images/hatenaquestion.gif’;

div.appendChild(img);


とまあ、こんなかんじでどうでしょうか?

◎質問者からの返答

なるほど、ありがとうございます。

サイトのデバッグ用に現在入っているコンテンツ

の親要素としてdivを設定したかったのですが、これではできないのですね。

出来る限り元のhtmlに手を加えないでどうにかそういう風に設定することってできるのでしょうか?


2 ● "><plaintext>
●50ポイント

http://members.jcom.home.ne.jp/jintrick/Personal/DOM_Range.html

DOM Rangeについて色々 - Personnel

参考URLは非常に面白いです。状況がいまいちわかりませんので御質問の件と合致するとは限りませんが応用範囲が広いはずです。

コピペには向かないかもしれませんが理念はつかめるのではと思います。

Coreな方法とRangeな方法とを「タスク2 複数要素のグループ化」で解説してくれているところが御質問に応用利きそうなところだと感じました。

◎質問者からの返答

ありがとうございます。

タスク2が希望通りの方法だと思いますので

時間があるときにチェックします


3 ● redcherry
●50ポイント

こんな方法もあります・・・

document.body.innerHTML=’<div>’+document.body.innerHTML+’</div>’;

◎質問者からの返答

ありがとうございます。


4 ● Mars
●50ポイント

一発で追加はできないのでbodyの子要素を全部移し変えるとうまくいくと思います。


<html>

<head>

<title></title>

<style type=”text/css”>

<!--

div{border:dashed 16px #fcc};

-->

</style>

<script type=”text/javascript”>

<!--

function addDiv() {

var Body = document.getElementsByTagName(’body’)[0];

var Div = document.createElement(’div’)

while(Body.firstChild) {

Div.appendChild(Body.removeChild(Body.firstChild));

}

Body.appendChild(Div);

}

//-->

</script>


</head>

<body>


<h1>追加テスト</h1>

<p><input type=”button” value=”DIV追加” onclick=”addDiv()”></p>


</body>

</html>

◎質問者からの返答

みなさんありがとうございます。

やりたいことができました。これにて質問は終了したいと思います

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ