トップページにテキストファイルから読み込んだ文章を表示することって
出来るんでしょうか? また、そのテキストファイルに何も文章がない時は
なにかしらのGIF画像を表示させたいのですが・・・。

どのカテゴリで質問すればいいのかわからなかったものでこちらに質問させて
いただきました。 場違いならすいません。

A 回答 (1件)

意図されていることからはちょっとはずれるかもしれませんが、以下のような方法はいかがでしょうか?



テキストファイルを読み込ませたいページのHTMLソースに
<SCRIPT SRC="xxx.js"></SCRIPT>
と記述します(※xxx.jsは任意の名前)。

次に、xxx.jsという名前のテキストファイルを作成し、
document.write("表示したい内容")
と記述します。

これで、xxx.jsの「表示したい内容」部分のテキストがHTMLファイルに記述した<SCRIPT SRC="xxx.js"></SCRIPT>の部分に読み込まれます。

なお、「表示したい内容」部分にはHTMLタグを書くこともできます。
    • good
    • 0

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

このQ&Aと関連する良く見られている質問

Q画面の表示位置を指定させて表示させたいのですが、カクカクさせずに表示さ

画面の表示位置を指定させて表示させたいのですが、カクカクさせずに表示させるにはどうしたらよいでしょうか?

下記書き方だと一度普通に表示されて、それから移動するみたいで、
一瞬、画面がカクカクしてしまいます。

初めから、移動させた状態で画面を表示させるには、どうしたらよいでしょうか?

<body onload="init();">
<script type="text/javascript">
function init(){
window.scrollTo("0","200");
}
</script>

Aベストアンサー

> なるべくスクロールさせたくない
ANo.3で回答したとおり、一度普通に表示されてから移動するのは正常な動作ですので、この仕様を変更することはできません。


> 予め画像を読み込む処理
画像プリロードによってやりたかったのは、あらかじめ画像サイズを取得することではないのですか?そう、解釈してANo.5は回答しました。


> スクロールしかない場合は、なるべく目立たないようにしたい
1.bodyの高さをあらかじめ適当なもの(長め)に設定する。
2.該当座標に移動する。
3.onLoad処理で、bodyの高さを本来のものにする。

<body onload="init();">
<script type="text/javascript">
document.body.style.height="2000px";
window.scrollTo("0","200");
function init(){
document.body.style.height="auto";
}
</script>

カクカクというのが分からなかったのでいろいろ書きましたが、ひとまず、このようにすれば、htmlレンダリング前に座標は移動できると思います。(JSをbodyの直前か先頭に書くことが前提)もしくは、jQueryのready()で指定すれば、こんな小細工はいらなかったような気がしますが、jQueryは本題ではないので割愛します。

> なるべくスクロールさせたくない
ANo.3で回答したとおり、一度普通に表示されてから移動するのは正常な動作ですので、この仕様を変更することはできません。


> 予め画像を読み込む処理
画像プリロードによってやりたかったのは、あらかじめ画像サイズを取得することではないのですか?そう、解釈してANo.5は回答しました。


> スクロールしかない場合は、なるべく目立たないようにしたい
1.bodyの高さをあらかじめ適当なもの(長め)に設定する。
2.該当座標に移動する。
3.onLoad処理で、bodyの高さを本来のも...続きを読む

Qカテゴリをクリックして、リンク先一覧を表示させたい

テーブル内のカテゴリをクリックすると、別テーブルにリンク先一覧を表示させるような、リンクページを作りたいのですが、下記のように組むと、

「リンク1」をクリック→別テーブルにちゃんとリンク先一覧が表示される。
次に「リンク2」をクリックすると「リンク1」のリンク先一覧の下に「リンク2」のリンク先一覧も表示されてしまう。
しかも2回クリックしないと表示されません(泣

「リンク2」をクリックしたら「リンク1」で表示させたリンク先一覧と入れ替えで、リンク先を表示させたいのですが、やり方が分かる方いらしたら、ご教授お願いします。

<HEAD>
<SCRIPT language="JavaScript">
<!--
// プルダウンメニュー
flag = false;
function pullDown01() {
if(flag) ID01.style.visibility = "hidden";
else ID01.style.visibility = "visible";
flag = !flag;
}
function pullDown02() {
if(flag) ID02.style.visibility = "hidden";
else ID02.style.visibility = "visible";
flag = !flag;
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<TABLE border="1">
<TBODY>
<TR>
<TD><A href="javaScript:pullDown01()">リンク1</a><BR>
<BR>
<A href="javaScript:pullDown02()">リンク2</a><BR>
</TD>
<TD style="width:380px;height:190px">
<DIV id="ID01" style="visibility: hidden;">
<A href="http://www.yahoo.co.jp/">■Yahoo!</A><BR>
</DIV>
<DIV id="ID02" style="visibility: hidden;">
<A href="http://bb.yahoo.co.jp/">■Yahoo! BB</A><BR>
</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</BODY>

テーブル内のカテゴリをクリックすると、別テーブルにリンク先一覧を表示させるような、リンクページを作りたいのですが、下記のように組むと、

「リンク1」をクリック→別テーブルにちゃんとリンク先一覧が表示される。
次に「リンク2」をクリックすると「リンク1」のリンク先一覧の下に「リンク2」のリンク先一覧も表示されてしまう。
しかも2回クリックしないと表示されません(泣

「リンク2」をクリックしたら「リンク1」で表示させたリンク先一覧と入れ替えで、リンク先を表示させたいのですが...続きを読む

Aベストアンサー

function pullDown01() {
if(ID01.style.visibility=="hidden"){
ID01.style.visibility = "visible";
ID02.style.visibility = "hidden";
}
}
function pullDown02() {
if(ID02.style.visibility=="hidden"){
ID02.style.visibility = "visible";
ID01.style.visibility = "hidden";
}
}

Q何もないところに文字を表示させたい

 よろしくお願いします。

 ページの再読込などをせずに、一つのページ内でボタンやリンクをクリックすることによって、新たに文字を登場させたいと思います。その際、以下のテクニックは知っています。

1)document.write()によって、周りのタグなども含めてすべて記述する。
2)フォームのテキストエリアにvalueとして反映させる。
3)背景色と同じ文字色にしておいた文字の色を変えることで、あたかも文字が登場したように見せる。

 1)は融通がききません。2)はテキストエリアが元からないといけないので、ページの地の部分に表示する方法ではありません。3)は隠しておいた文字以外の文章に変換できません。

 <div>や<p>や<span>、あるいはテーブルの<td>要素の中身(文字)のみをダイレクトに変換できるテクニックがあればお教えください。

Aベストアンサー

>要素の中身(文字)のみをダイレクトに変換できるテクニックがあればお教えください

innerHTMLを使えばよいと思います。

サンプル
<html>
<head>
<script language="JavaScript"><!--
function test() {
document.getElementById("div1").innerHTML="DIVの中身を変更しました。";
document.getElementById("td1").innerHTML="TDの中身を変更しました。";
}
// --></script>

</head>
<body>
<a href="javascript:void(0);" onClick="test();">変更</a>
<div id="div1"></div>
<table border="1"><tbody>
<tr><td>tableのテスト</td></tr>
<tr><td id ="td1"></td></tr>
</tbody></table>
</body>
</html>

>要素の中身(文字)のみをダイレクトに変換できるテクニックがあればお教えください

innerHTMLを使えばよいと思います。

サンプル
<html>
<head>
<script language="JavaScript"><!--
function test() {
document.getElementById("div1").innerHTML="DIVの中身を変更しました。";
document.getElementById("td1").innerHTML="TDの中身を変更しました。";
}
// --></script>

</head>
<body>
<a href="javascript:void(0);" onClick="test();">変更</a>
<div id="div1"></div>
<table border=...続きを読む

Qオンマウスでテキストエリアにテキスト表示

現在、「猫」という文字にカーソルを合わせると
text1のテキストエリアに
「ニャンと鳴く」と表示されるスクリプトを作成しました。
記述の一部ですが下に示します。

<form name="form1">
<TEXTAREA name="text1" rows="5" cols="40"></TEXTAREA>
</form>
<span onmouseover="txt_dsp('text1','ニャンと鳴く');"onmouseout="txt_dsp('text1', '');">猫</span><br>

教えていただきたいのは'ニャンと鳴く'という部分を
msg.txtというテキストファイルに書かれた'ニャンと鳴く'
で表示したいのですが、どのような記述にしたらよろしいでしょうか?
よろしくお願い致します。

Aベストアンサー

テキストファイルは、クライアントでは無くWebサーバーにあるんですよね?

ajax は勿論正解ですが、CGI でテキストファイルの内容を JavaScript の変数に渡してもできるでしょう。 参考URL の回答No.1 の後半です。

ただし、使用する可能性のあるデータ全てを最初からクライアントに送らねばなりません。 なので、送る量(バイトサイズ)が多いならお勧めできません。

逆に、送る量が少い場合には、サーバー通信をせずに迅速に結果を得られるこの方式が ajax より簡単にユーザーフレンドリーなページを作れるでしょう。

参考URL:http://okwave.jp/qa4553428.html

Qonclickで別の場所にテキストを表示させたい

<a onMouseover="this.style.textDecoration='underline'" onMouseout="this.style.textDecoration='none'" onclick="document.all.d.style.display=document.all.d.style.display=='none'?'':'none'">★★

<p ID=d STYLE="display:none">●●

という★★(否リンク)ではないテキストをクリックする(オンマウスオーバーで下線表示)と別の場所に●●が表示されるという支持をHTMLで出しているのですが、これをJavaScriptで指示させる事は可能でしょうか?今のままだとネスケでオンクリックが動かないので困っております…要はネスケでもIEでも動くような指示を出したいのですが…

Aベストアンサー

document.all.dではなく
document.getElementById('d')
を使いましょう


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

おすすめ情報