重要なお知らせ

「教えて! goo」は2025年9月17日(水)をもちまして、サービスを終了いたします。詳細はこちら＞

【GOLF me！】初月無料お試し

各ページごとにjsで表示内容を変更したい

解決済

  • 質問者：kim001
  • 質問日時：
  • 回答数：4件

ページごとにディレクトリ名を判別して表示内容を変更するスクリプトを書きたいのですが、現状ieでのみ動作が不安定です。yuga.jsに組み込む形で記述しています。

//script------------------------
var filePath = location.href;
var a = filePath.split('://');
schema = a[0];
var d = a[1].split('/');
host = d.shift();
var f = d.pop();
var dirs = d;
if(dirs == 'hoge'){
var target = '<li><a href="..\/hoge\/index.html">hoge1<\/a><\/li>' +
'<li><a href="..\/hoge\/hoge2.html">hoge2<\/a><\/li>' +
'<li><a href="..\/hoge\/hoge3.html">hoge3<\/a><\/li>'
}
document.getElementById('listWrap').lastChild.innerHTML(target);

//html-----------------------------
<div id="listWrap">
<img src="./images/listTitle.jpg" alt="" width="**" height="**" />
<ul id="list"></ul>
</div>

上記スクリプトを外部から読み込んでonloadで実行していますが、ieでは
document.getElementById('listWrap')がnullを返すことが多く、表示される場合とされない場合があります。
ご教授よろしくお願いします。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (4件)

No.4ベストアンサー

  • 回答者： OKbokuzyo
  • 回答日時：

細かいミスは置いといて、、



>>document.getElementById('listWrap')がnullを返すことが多く

Scriptを直接先頭に書き、その後にhtmlを書いていませんか？
下記例３つの違いは認識していらっしゃるでしょうか？

１．
---↓これは「null」と表示されます
<html>
<script>
alert(document.getElementById("listWrap"));
</script>
<body>
<div id="listWrap"></div>
</body>
</html>
---

２．
---↓これは「object」と表示されます
<html>
<body>
<div id="listWrap"></div>
</body>
<script>
alert(document.getElementById("listWrap"));
</script>
</html>
---

３．
---↓これも「object」と表示されます
<script>
function test(){
alert(document.getElementById("listWrap"));
}
</script>
<html>
<body onload="test()">
<div id="listWrap"></div>
</body>
</html>
---

基本的には、HTML文書は上から順に読み込まれます。
１．の場合、HTMLを上から読んでいくとid="listWrap"のタグは
まだ読み込まれていませんので「null」となります。
２．の場合はHTMLが先に読み込まれるのでid="listWrap"は有効となります。
３．の場合はbodyタグのonloadイベントで呼んでいます。
onloadイベントはすべて読み込まれた次点で開始となるので
これも有効となります。

読み込みの制御はソフトの作りによるので当然ブラウザ毎に異なります。
ページ表示時に何かJavaScriptで処理を行う場合
３．のfunctionとしてonloadに書くのが一般的です。
    • good
    • 0
    • 件
通報する
この回答へのお礼

解説いただきありがとうございます。
問題解決の参考になりました。
スクリプトを読み込む順番がおかしかったようです。

通報する
お礼日時：2008/04/23 02:22

No.3

  • 回答者： auty
  • 回答日時：

if(d.length ==1){dirs = d;}


else{dirs = d[0];}
------------------------------
これもまだ変です。あくまで、

dirs = d;　は、配列
dirs = d[0]は、文字列
です。

下記の場合を参考にしてください。

[例]
1.　var filePath = 'http://okwave.jp/qa3962294.html';　のとき
　　d[0]==undefined
　　d[1]==undefined

2.　var filePath = 'http://okwave.jp/root/qa3962294.html';　のとき
　　d[0]==root
　　d[1]==undefined

3.　var filePath = 'http://okwave.jp/root/sub/qa3962294.html';　のとき
　　d[0]==root
　　d[1]==sub
    • good
    • 0
    • 件
通報する
この回答へのお礼

ご指摘ありがとうございます。
お礼が遅くなり申し訳ありません。
trueになることがなかったので、該当箇所の間違いを見落としていました。

通報する
お礼日時：2008/04/23 01:54

No.2

  • 回答者： auty
  • 回答日時：

[追記]



・　もう一つ気になることがありました。

　　dirsは、配列ですね。

　　？？？　if(dirs == 'hoge')

この回答への補足

すみません。
rootから1階層下を前提にしているので
dirs = d[0];
です。ご指摘ありがとうございます。

補足日時：2008/04/20 16:29
通報する
    • good
    • 0
    • 件
通報する
この回答へのお礼

質問の意図が明確でなくて申し訳ありません。
if(d.length ==1){dirs = d;}
else{dirs = d[0];}
var target = "上記の内容";
$("#list").html(target);//jqueryをつかっていました。
これで、ie6,7だとレンダリングされないことが多く、getElementByIdで得たノードがnullになっていることがわかったので、どうしたらよいでしょうかというのが質問内容です。

通報する
お礼日時：2008/04/20 16:50

No.1

  • 回答者： auty
  • 回答日時：

・　innerHTMLの書き方が間違っているようです。



document.getElementById('listWrap').lastChild.innerHTML = target;

または
document.getElementById('list').innerHTML = target;
    • good
    • 0
    • 件
通報する
この回答へのお礼

早速ご回答いただきありがとうございます。
記述ミスでした。ご指摘ありがとうございます。
上記箇所のdocument.getElementById('list')で、ieの場合nullが返されることが多いため、こまっています。
DOMツリーの読み込みが完了していればnullにならないと思っていたのですが。。。

通報する
お礼日時：2008/04/20 16:22

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

Q質問する（無料）

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報