• ベストアンサー

外部からファイルを読み込んだページを作りたい

HTMLページを作っているのですが以下のようなことは実現できないでしょうか。 (1)HTMLの"タイトル"に表示する文字列を、外部のテキストから読み込む。 (2)外部のテキストを更新すれば、(1)のHTMLの"タイトル"も変更される。 この様なHPを作りたいと考えています。 たとえば <title>こんにちわ</title> とべた打ちするのではなく、 titletext.txtというファイルに「こんにちは」と入力し、 <title></title>内にその内容（こんにちはという文字）を読み込むようにしたいです。

質問者が選んだベストアンサー

  • ベストアンサー
回答No.9

＃５です。ご指導有難うございます。 ファイルを得る程度ならこれでも可？ var getFile = (function( create ) { 　return function ( file_name ) { 　　var ajax = create( ); 　　 　　if( ajax ) { 　　　ajax.open( 'GET', file_name, false ); 　　　ajax.send( null ); 　　　return ( 200 == ajax.status ) ? ajax.responseText: 'Error'; 　　} 　　return false; 　}; })( 　　function ( ) { 　　　try { return new XMLHttpRequest } catch(e1) { 　　　　try { return new ActiveXObject( 'Msxml2.XMLHTTP.6.0' ) } catch(e2) { /* 　　　　　try { return new ActiveXObject( 'Msxml2.XMLHTTP.3.0' ) } catch(e3) { */ 　　　　　　return null; } } // } 　　} 　);

kurigara_k
質問者

お礼

詳しい回答ありがとうございました。

その他の回答 (8)

  • Chaire
  • ベストアンサー率60% (79/130)
回答No.8

例えば XInclude を使います。XInclude は XML を結合する規格であり、名前空間接頭辞や実体参照、基底 URI の修正など、XML に特有の情報項目も調整してくれます。 https://developer.mozilla.org/en/XInclude ここに Firefox/Mozilla 用の簡単なコードがあります。xpointer() が不要なら、この程度でも十分でしょう。XInclude の書式は標準化されていますから、JavaScript でなく、後で PHP や C++ で処理したくなった場合にもそのまま使えます。 http://www.amplesdk.com/ample/ Ample SDK には IE（および HTML）でも動作する XInclude 処理系があります。実際には xpointer() はおろか parse="text" すら未対応ですが、フォールバック機能と、script 要素を利用した内容退避は、文書の再利用に役立ちます。 <title xmlns="http://www.w3.org/1999/xhtml"> 　<script type="application/ample+xml"> 　　<xi:include href="title.xml" xmlns:xi="http://www.w3.org/2001/XInclude"> 　　　<xi:fallback>読み込み失敗時の内容</xi:fallback> 　　</xi:include> 　</script> </title> ここで問題があるとすれば、No.1 の指摘通り、HTML4/XHTML1 および X/HTML5 で、title 要素内の script 要素が妥当性違反であるということです。かと言って、title 要素ごとインクルードしても、元の文書に title 要素がなくては、やはり妥当性違反です。 どのレベルで検証するかが問題なのですが --- XInclude は、実行後のソースには何の痕跡も残しません。上記を XInclude 処理し、仮に読み込みに失敗したとしても、残るのは <title xmlns="http://www.w3.org/1999/xhtml"> 　　　読み込み失敗時の内容 </title> だけとなります。もちろん、これは検証をパスします。ほとんどの場合、妥当性検証が必要なのは処理後のデータですから、これを HTML4 の『HTML 文書は、どの SCRIPT 要素の処理前も処理後も、HTML DTD に適合するよう制約される』（18.2.4）への言い訳とします。 もっとも、こうした結合処理をクライアント側でやっても、No.3 が仰るようにメリットはほとんどありません。サーバ側で処理するか（であれば PHP の DOMDocument->xinclude の方が手っ取り早いですが）、もしくはあらかじめ手元で結合＆検証を一括して行い、その結果をアップロードするのが賢明と言えます。 少なくとも、JavaScript が動作しないとタイトルすら得られないのでは、ページを保存するだけでタイトルが分からなくなります。検索エンジンに対しても致命的でしょう。一括置換ソフトを利用するなど、他の方法を探すことをお勧めします。 To No.5: MSXML のバージョンと JScript のバージョンは無関係です。また、Microsoft.XMLHTTP は MSXML 2.x 以前のもので、現在メンテナンスが終了しているため、使用しないで下さい。かつ、MSXML 3.0 からはデフォルトバージョンが 3.0 になりましたので、Msxml2.XMLHTTP.6.0 のようにバージョンを明示しないと適切なものを呼び出せません。 また、ActiveX が無効、あるいは与えられた ProgID が無効なときに new ActiveXObject すると例外が発生しますので、必ず try...catch して下さい。ついでに、JScript 5.7 以下で ActiveXObject を使うのなら、onreadystatechange を使い終えた後 new Function で上書きする等して循環参照を切って下さい。

kurigara_k
質問者

お礼

詳しい回答ありがとうございました。

  • cmc32000
  • ベストアンサー率41% (103/251)
回答No.7

No4の追加です。ついでに実験してみました。 <HEAD>と</HEAD>の間に、 <script language=Javascript> document.write("<TITLE>" + mesg + "</TITLE>"); と入れれば、少なくともIEではページタイトルもテキストファイルから読み込ませられました。

kurigara_k
質問者

お礼

ありがとうございました。

  • cmc32000
  • ベストアンサー率41% (103/251)
回答No.6

No4にスペルミスがありました。 ver は　var です。失礼しました。

回答No.5

ごめん！ちゃんとしたajaxのらいぶらりーでもつかってね ただしいのか、さっぱりわかりませんが・・・^^; <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Script-Type" content="application/javascript"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>TEST</title> </head> <body> <p>びみょう</p> <script type="text/javascript"> //@cc_on @set @v = @_jscript_version; if(! /^http/.test( location.href ) ) 　alert( 'この環境じゃ動かない' ); function getFile ( file_name ) { 　var text = null; 　var ajax =　/*@if (@v < 5.6) null 　　@elif( @v < 5.7 ) new ActiveXObject( 'Microsoft.XMLHTTP' ) 　　@elif( @v < 5.8 ) new ActiveXObject( 'Msxml2.XMLHTTP' ) 　　@else@*/ new XMLHttpRequest( ) /*@end@*/; 　if(! ajax ) return null; 　ajax./*@if(@v) onreadystatechange @else@*/ onload /*@end@*/ = 　　function( ) { 　　　if( 4 == ajax.readyState ) { 　　　　if( 200 == ajax.status ) text = ajax.responseText; 　　　　if( 404 == ajax.status ) text = '[Error!! File is not found.]'; 　　　} 　　}; 　ajax.open( 'GET', file_name, false ); 　ajax.send( null ); 　return　text; } document.title = getFile( 'title.txt' ); </script> </body> </html>

kurigara_k
質問者

お礼

詳しい回答ありがとうございました。

  • cmc32000
  • ベストアンサー率41% (103/251)
回答No.4

No1の回答者です。 もっともシンプルな例として、書きます。 1.メモ帳で、ver mesg="こんにちは"; の1行を、titletext.txt で保存します。 2.htmlファイルの中に、 <script language="Javascript" src="titletext.txt"></script> <script language="Javascript">document.write(mesg)</script> を書き込みます。これで、titletextに書き込んだ内容が表示されます。htmlのscript文の2行目は、メッセージを書きたい場所に置きます。1行目は、これより前の<head></head>の中に書くと良いでしょう。 ローカルでの実行には、ブラウザのセキュリティを変更します。

kurigara_k
質問者

お礼

ありがとうございました。

  • zxcv0000
  • ベストアンサー率56% (111/196)
回答No.3

No.1 さんのおっしゃるとおり、それをJavaScriptで実現するには Ajax を使います。 ただし、その「外部ファイル」のありかがそのHTMLのある Webサーバー以外なら、簡単にはできません。 しかし、その処理は普通は JavaScript では無く CGI等のサーバーサイド処理で行います。 (SSI でもできますが、お勧めはしません) サーバーサイド処理は、Perl CGI にしろ PHP にしろ、「クライアントに返送する HTML の生成」を行います。 そのついでに外部ファイルを読んでTITLEタグに挿入するのは何でもない処理です。 それに対して Ajax でやった場合、クライアントのWebブラウザはHTMLの読込処理とは別にサーバーにリクエストを送ってレスポンスを読まにゃなりません。 サーバーにもそれに応答する負荷がかかります。 という訳で、サーバーサイド処理をお勧めします。

回答No.2

「ajax」で検索してみて下さい。 「javascript CSI」で検索すると専用のツール（ライブラリ）が見つかりますが、中身はAjaxそのものです。

  • cmc32000
  • ベストアンサー率41% (103/251)
回答No.1

javascriptの外部ファイルを読み込ませることで可能ですが、<title>タグの中で使うことは出来ないでしょう。 テキストファイルに、変数を定義する文を書き、それをスクリプトファイルとして読み込ませ、Document.write(変数名)を実行させます。 これを、titleタグの中では実行できませんが、<body>の中では使えます。

kurigara_k
質問者

お礼

ありがとうございます。 Document.write(変数名) を使うんですね。 図々しい質問なのですが、サンプルが載せられたページとかってないですか？ 調べてみたのですが、やりたいこと(外部からファイルを読み込む)が乗っているページを見つけることが出来ませんでした。

  1. カテゴリ
  2. [技術者向] コンピューター
  3. プログラミング・開発
  4. JavaScript

関連するQ&A

  • 外部ファイル操作について

    外部ファイルへの入出力のやり方についてアドバイスお願いします。 外部ファイルは 書き込み専用（Sample.txtの内容を書き込む）のファイル「Test.txt」と 書き込む内容を記載してあるファイル「Sample_01.txt」と「Sample_02.txt」の２種類を用意しておきます。 「Sample_01.txt」には 1.おはよう 2.こんにちは 3.こんばんは Sample_02.txt」には 1.いただきます 2.ごちようさま 「Test.txt」の１行目には 【Sampleテキストの内容】 という文字列をそれぞれ初めから記載しておきます。 ファイルの読み込み・書き込みにおいて、「Test.txt」に1行目（【Sampleテキストの内容】 ）を消さずに読み込み・書き込みするにはどうしたらよいのでしょうか。 また、「Test.txt」に1行目に【Sampleテキストの内容】という文字列が存在するかを判定するにはどうしたらよいのですか。 お手数ですが、アドバイスお願いします。 出力はDOS画面に行います。

    • ベストアンサー
    • Java
  • HTMLページに外部テキストファイルを取り込むには？

    HTMLのページに、一部だけ外部ファイルのデータを取り込もうとしています。 <HTML> <BODY> <P><TABLE WIDTH="450" > <TR> <TD><IMG SRC="picture1.jpg"></TD> <TD >ここにJavascriptで自由更新文（１）を入れる</TD> </TR> </TABLE><BR> <TABLE WIDTH="450"> <TR> <TD><IMG SRC="picture2" ></TD> <TD>ここにJavascriptで自由更新文（2）を入れる</TD> </TR> </TABLE> </BODY> </HTML> 上のような、写真と説明文がセットになったテーブルがいくつか配置されているページがあるとします。 その説明文を、HTMLを見たこともない人物に自由に更新してもらわねばなりません。 そこで、例えば「１つめの写真の説明文は1.dat、２つめの写真の説明文は2.dat …と、単純にテキストだけを打った.datとか.txtファイルをサーバにアップロードしてもらい、htmlページはJavascriptでその.datファイルをテーブル内に読み込むようにして使いたいのですが、そのJavascriptはどんな書き方をすればよいでしょうか？ <script type="text/javascript" src="1.js"></script>といったように読み込む場合、1.jsの内容は単純なテキストでなく document.write("これは例文です。"); // End といったように、ソースになっていなければダメですよね？ これでは間違って「"」等を消されたらファイルが壊れてしまいます。このため、こういう内容でなく、「document.write("」や「");」や「// End 」も無い、単純なテキストだけを外部ファイルにすることはできないでしょうか？

  • 複数のファイルに同じ文字列を自動入力するバッチ

    複数のテキストファイルに同じ文字列を入力して保存するバッチを作成したいです。 テキストファイル１.txt テキストファイル2.txt テキストファイル3.txt 上記３つのテキストファイルがあったとしてバッチを起動すると 同じ文字列のデータを自動的に入力したい。 自動入力する文字列：あいうえお そもそも実現可能なのかもよくわかっていませんが ご教示いただけますと幸いです。

  • 外部JSから読み込んだ文字列をフォームに表示

    ボタンを押した後で、文字列を外部JSからランダムに読み込ませて表示させることはできますか？ HPで使用するものではなく個人的にTRPG（NPCの決定など）に使おうと思っています… １つのページに５つほどランダムテキストを置いたのですが、ソースを見ると数が多くなってしまい後から文章を付け加えるのに苦労してしまうので、外部JSファイルから読み込ませることにしました。しかし、 var txt = new Array(); txt[0]="あああ"; txt[1]="いいい" txt[2]="ううう"; mmax = 3; txtno = Math.floor(Math.random() * mmax); document.write(txt[txtno]); 普通にこれを読み込むとページを開いた時から文字列が表示されてしまいます。 ボタンクリックでフォームに表示させることはできないかな？と思いましたが、どうもどうすればいいか分かりません…

  • 外部テキストに書いたHTMLタグがそのまま表示されてしまう。

    現在、Flash作成フリーソフト「Suzuka」で、Flashを作成中なのですが、 どうしても分からない箇所がありますので、アドバイスをよろしくお願いします。 以下のことでつまずいてます。 ダイナミックテキストに外部テキストを読み込ませることは出来るのですが、 外部テキスト内に書いているHTMLタグが、そのまま表示されてしまい、困っています。 外部テキストの内容はこんな感じです。 total=4& &txt0=<font color="#ff0000">文字の色を赤に変えたいです</font>& &txt1=あいうえお& &txt2=かきくけこ& &txt3=さしすせそ テキストのプロパティで「HTML」にチェックをいれてプレビューまたは、パブリッシュ後にブラウザで確認しても、 どうしてもタグが解釈されずに、そのまま<font color="#ff0000">文字の色を赤に変えたいです</font>で表示されてしまいます。 Suzukaのヘルプには、<font>タグがサポートされていると書いてあるのですが…。 Flashに詳しい方、アドバイスをよろしくお願いいたします。

    • ベストアンサー
    • Flash
  • 外部テキストファイルを取り込めないでしょうか。

    はじめまして。 個人でホームページを作っている素人です。 背景に画像を使って、その上に文字を乗せるというページを作っているのですが、更新の時にhtmlを開くのではなく、外部にテキストファイルを設置して、それを更新すれば簡単にホームページの文字を変えることができるというようなことはできないものかと思い、質問させていただきました。 いろいろと検索をしてみたのですが、Flashでしたら取り込めるということはわかったのですが、普通のhtmlでは見つけられませんでした。 ご存知の方がいらっしゃいましたら、教えてください。 よろしくお願いします。

    • ベストアンサー
    • HTML
  • テキストデータをファイルに書き出す方法

    HTMLページの<TEXTAREA>にキーインした文字列をテキストデータとして、拡張子.txtファイルに書き出す方法？ このHTMLページはアップロードする物ではなく、個人のデスクトップパソコンの中だけでインターネットエクスプローラで開く(見る)だけです。

  • Webページの保存

    似たような質問を検索しましたがよくわからないので教えてください。 たとえば「料理のレシピを保存したい」とき。「そのページだけ単独でとっておければいい」のですが（リンクとか無視してもかまわないということ） （１）Webページ、完全（*.htm.*html） （２）Webページ、単一のファイル（*.mht） （３）Webページ、HTMLのみ（*.htm.*html） （４）テキスト ファイル（*.txt） 保存の方法は（２）で良いのでしょうか？ HP自体がなくなってしまったり更新されても大丈夫ですか？

  • Flashで外部ファイルの指定行のみ取り出し表示

    初心者です。 当初は、ActionScriptで外部ファイルphpを読み込み、phpの中にtxtから取り出した文字列を表示しようとしていました。 多分、これでもできると思いますが、ActionScriptからphp経由せず、直接txtから取り出せないかと思い、質問します。 ActionScriptで外部ファイル（txt）の中身の2行目だけ取り出すという方法はできるのでしょうか？ ＜テキスト例（txt）＞ 花子 東京都 乙女座 このうち2行目の東京都だけ取り出すということです。 こちらの方が、phpをわざわざ挟まずにシンプルだと思いました。 よろしくお願いします。

    • ベストアンサー
    • Flash
  • 外部読み込みJSファイルで読み込まれたページの文字列によってジャンプしたい

    JSファイルを外部読み込みで行い、 そのページの文字列を解析して、文字列"れもん" があればＡのページにジャンプ、 文字列"りんご"があればＢのページにジャンプしたいのですが、 そう言ったことは可能でしょうか？ 参考になるURLを教えて頂ければ幸です。m(__)m

注目のQ&A

カテゴリ

専門家に質問してみよう

職業から探して質問する

あなたにピッタリな商品が見つかる！ OKWAVEセレクト

質問する