ついに夏本番!さぁ、家族でキャンプに行くぞ! >>

こんにちは。
いつもいつも「教えてgoo」には助けられているモノです。

今回質問をさせて頂きたいことは、
JavaScriptでテキストファイルを読み込む方法です。

私が今回したいことは、
---
1.JavaScriptでファイル内データの読み込み

2.読み込んだテキストをsplitさせ、配列に入れ込みたい。
---
と、言うことをしたいのですが。。。
(2)は何とか出来ているのですが、(1)がよくわからず・・・
どなたかご存じの方いらっしゃいましたらご伝授よろしくお願いしますm(._.)m

このQ&Aに関連する最新のQ&A

A 回答 (2件)

//@cc_on


function getTextFile (fname) {
var text = null;
var ajax = new XMLHttpRequest();
with (ajax) {
/*@if(1) onreadystatechange @else@*/ onload /*@end@*/ =
function () { readyState == 4 && status == 200 && (text = responseText); };
open('GET', fname, false);
send(null);
};
return text;
}

alert(getTextFile('sql.txt'));

http://jsgt.org/ajax/ref/charset_test/responsete …
    • good
    • 3
この回答へのお礼

ご回答ありがとうございます!

無事!!!
出来ました≧_≦

やりたいことが出来、、、
感激です!
ありがとうございますm('-')m

お礼日時:2009/04/22 11:46

エラーチェックしてないから駄目な見本ということで


//@cc_on
function getTextFile (fname) {
var text = null, ajax;
if (ajax = new /*@if(1) ActiveXObject("Microsoft.XMLHTTP") @else@*/ XMLHttpRequest() /*@end@*/)
with (ajax) {
onreadystatechange = function () { readyState == 4 && status == 200 && (text = responseText); };
open('GET', fname, false);
send(null);
};
return text;
}
alert(getTextFile('data.txt'));

この回答への補足

あと。。。
図々しくてすみません…

Operaで確認できた場合、日本語が文字化けをしていました。
エンコードの問題なのでしょうか?
よろしくお願いします。

補足日時:2009/04/20 17:29
    • good
    • 0
この回答へのお礼

早速の回答ありがとうございます!

試してみました^-^
ローカルサーバーにUPして実行すると。。。
Operaだと上手く動くのですが…
Firefoxだとnullになってしまいました^^;;

でもOperaで動いた瞬間感激しました^_^b

お礼日時:2009/04/20 17:24

このQ&Aに関連する人気のQ&A

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

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

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

Q変数の代入値を外部の.txtファイルから読む

var AAA = "XXXX";

このように変数AAAにXXXXという値を代入したいのですが、XXXXは外部ファイルTEXTDATA.txt内にあります。
javascriptのみで、TEXTDATA.txtをオープンして文字列を取得することはできるのでしょうか?

TEXTDATA.txt には XXXX 以外の文字はありません。

だれか回答できるかた、よろしくお願いします。

Aベストアンサー

<script>
w=window.open("TEXTDATA.txt","tmp","width=100,height=100")
var AAA = w.document.all[0].innerText
w.close()
document.writeln(AAA)
</script>

こんな感じでどうでしょうか。

とほほさんのページを見て、いま作ってみました。

参考URL:http://tohoho.wakusei.ne.jp/js/index.htm

Qテキストファイルやcsvファイルで読み込んだデータを使ってjavascriptで処理する方法

javascript初心者です。
いろいろと調べたのですが、イマイチよく分からないので質問させてください。
テキストファイルやcsvファイルを読み込んで、
javascriptで判定処理をしたいと思います。

例えば、

A地区,1
B地区,0
C地区,4
・・・

といったデータを読み込んで、
javascriptで「0なら○地区には画像Aを表示、
それ以外なら○地区には画像Bを表示する」
という形で処理したいです。
でも、
・どうやってファイルを読み込むのか
・読み込んだデータをどのようにして配列へ入れるのか
がよく分からないです。
これらのページ
「http://q.hatena.ne.jp/1195740627」
「http://www.openspc2.org/JavaScript/Ajax/Ajax_study/chapter03/002/index.html」
のような方法を参考にすれば実現可能なのでしょうか。

Aベストアンサー

> ・どうやってファイルを読み込むのか

2つめの参考ページがそのままです。
これでわからなければもっと基本的なことから始めるべきです。
足し算やかけ算ができなければ、円の面積は解けないのと同じです。

http://www.openspc2.org/JavaScript/
http://www.tohoho-web.com/www.htm

1つめの参考ページは若干特殊な方法なので無視した方がいいかもです。

Qtxtの中身を表示する方法教えてください!(javaスクリプト?)

デスクトップに置いてあるひとつのフォルダに、A.htmlというファイルと、B.txtというファイルがあります。
A.htmlをブラウザ(IE)で開いたとき、B.txtの中に書いてある文章をまるまる表示させるには、
どのようにすればいいでしょうか?

ネット上でいろいろ調べたところ、http://questionbox.jp.msn.com/qa3189160.htmlの質問にイメージが近かったのですが、
読み込むファイルはjsじゃないですし、中身を変更したくない(↑の質問のように、”var data = [・・・”といった書き換えをしたくない)のです・・・。

htmlファイルも、txtファイルも、サーバーには送りません。
ネットに繋がっていないパソコンでだけ使います。

よろしければ、サンプルプログラムを書いていただけると助かります。
本当に困っております、どうぞよろしくお願いいたします!

Aベストアンサー

Ajaxを使ってtxtファイルを読み込めばいいはずですが、Ajaxをご自分で実装されるとなると面倒だと思います。
一番手っ取り早い方法としては、jQuery(http://jquery.com/)などのAjaxライブラリを使用することです。

以下、jQueryを使用してtxtファイルを読み込むサンプルです。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="content-style-type" content="text/css">
<meta http-equiv="content-script-type" content="text/javascript">
<script type="text/javascript" src="jquery-1.3.2.js"></script>

<script type="text/javascript">
<!--
$(document).ready(function() {
$("#container").load("B.txt");
});
//-->
</script>

</head>
<body>

<!-- テキストを表示する部分 -->
<div id="container"></div>

</body>
</html>

Ajaxを使ってtxtファイルを読み込めばいいはずですが、Ajaxをご自分で実装されるとなると面倒だと思います。
一番手っ取り早い方法としては、jQuery(http://jquery.com/)などのAjaxライブラリを使用することです。

以下、jQueryを使用してtxtファイルを読み込むサンプルです。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta http-equiv="content-style-type" content="text/c...続きを読む

Qwebブラウザからローカルファイルの読み込み

はじめまして、質問します。
webブラウザからローカルファイルの読み込みを行いたいのですが、
セキュリティーの問題でアクセスを拒否されました。
その回避法として、FileAPIによって
htmlのinput要素かドラッグアンドドロップを用いて
ローカルファイルを読み込めることが分かりました。

しかし、私がやりたいことは
絶対パスでローカルファイルを読み込むことです。

そのようなことは可能でしょうか?
上記の方法だとinputからフォルダをたどってファイルを選択するので
原理的には可能なような気がするのですが・・・・

言語はjavascriptです。
よろしくお願いします。

Aベストアンサー

>その回避法として、FileAPIによって
>htmlのinput要素かドラッグアンドドロップを用いて
>ローカルファイルを読み込めることが分かりました。

>上記の方法だとinputからフォルダをたどってファイルを選択するので
>原理的には可能なような気がするのですが・・・・

根本的な部分で勘違いをされている気がします。ドラッグ&ドロップで渡されるのはファイルのパスなどではありません。これはFileListオブジェクトという専用のオブジェクトで、その中に個々のファイルに関するFileオブジェクトが保管されています。このFileオブジェクトをFileReaderなどに渡すことでその内容を読み取ったり出来る仕組みになっています。

ただし、ここで勘違いしてはいけないのですが、このFileオブジェクトには、ファイルのパス情報は含まれていないのです。あるのはファイル名の情報だけ。そのファイルがどこにあるかといったことはJavaScript側からは隠蔽されており、スクリプトからタッチできません。

つまりJavaScriptでは、「パスによるファイルの指定」は過去も現在も首尾一貫して禁止されており、不可能なのです。

ドラッグ&ドロップは、ユーザーの能動的な動作により起こるイベントです。つまり、ユーザーが自分で「このファイルをアップロードしよう」といった具合に操作した結果の行動です。これに対し、「ファイルのパスによるファイルアクセス」は、ユーザー不在であり、プログラムが自分で勝手にファイルにアクセスできることを意味します。両者は全く違います。

>その回避法として、FileAPIによって
>htmlのinput要素かドラッグアンドドロップを用いて
>ローカルファイルを読み込めることが分かりました。

>上記の方法だとinputからフォルダをたどってファイルを選択するので
>原理的には可能なような気がするのですが・・・・

根本的な部分で勘違いをされている気がします。ドラッグ&ドロップで渡されるのはファイルのパスなどではありません。これはFileListオブジェクトという専用のオブジェクトで、その中に個々のファイルに関するFileオブジェクトが保管されています...続きを読む

Qjavascriptでテキストファイルを作成したい

javascriptを勉強していて演算した結果をテキストファイルにして、その結果をテキストファイル内に書き込んで新しくデスクトップに作成するというプログラムを作りたいと考えています。
ですが、まずは以下の条件を満たすプログラムの内容を教えていただきたいと思います。

私はHTMLと同時にjavascriptを作っているのですがとりあえず、

・「テキストファイルの作成」というボタンをHTML内に作ります。
・そのボタンを押すとjavascriptのfunctionが動作し、「テキストの書き込みに成功しました」という内容が書かれたテキストファイルがデスクトップに新たに作成される。

というプログラムを知りたいです。

基礎的な原理だけを知りたいので上の条件を満たすプログラムを教えていただきたいと思います。
テキストファイルをデスクトップに作る方法と、作るテキストファイルにどのようにしてテキスト内容を書き込めばいいのか分かりません。
HTMLの部分がめんどくさければjavascriptの部分だけでも構いません。
よろしくお願いします。

Aベストアンサー

#2 です。

勉強目的ということでしたのでブラウザ(IE)依存で問題ないと考えていました。WSH でも hta でも JScript は利用できるはずなので。
質問者さんは以下の希望を持っていると想像していました。

・JavaScript だけでテキストファイルに出力したい
・ローカルで実行するので、ブラウザ依存で構わない (Webサイト制作が目的ではない)

そうではなく、

・Webサイト制作する上での JavaScript を知りたい
・標準的な JavaScript を学びたい (ブラウザ依存はしたくない)
・JavaScript 以外の言語(PHPなど)を学ぶこともいとわない

ということでしたら、私の見込み違いですのでどうぞスルーしてください…。
サーバサイドでファイル出力するのが一般的な手法だと私も思います。

QjQueryで外部テキストファイルを読み込みたいがうまくいきません

jQueryで外部テキストファイルを読み込みたいと思っています。
https://ghweb.info/post-2976.htmlを参考にしてやってみたのですが、どうもうまくいきません。
上記参考サイトのサンプル1は読み込めます。

------------------ サンプル1 --------------------
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jQueryでテキストファイルを表示する</title>
<script src="js/jquery.min.js"></script>
<script>
$(function() {
$("#read_text").load("sample_txt.txt");
});
</script>
</head>
<body>
<h3>.load()でテキストファイルを読込み</h3>
<div id="read_text"></div>
</body>
</html>

しかし、$.getで読み込むサンプル2がどうしても読み込めません。

------------------ サンプル2 --------------------
<script>
$(function() {
$.get("sample_txt.txt", function(data){
$("#read_text").text(data);
});
});
</script>

これで半日ほどハマっています。何か根本的に間違っているんでしょうか?
OSはLinux mint、ブラウザはfirefoxです。

jQueryで外部テキストファイルを読み込みたいと思っています。
https://ghweb.info/post-2976.htmlを参考にしてやってみたのですが、どうもうまくいきません。
上記参考サイトのサンプル1は読み込めます。

------------------ サンプル1 --------------------
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jQueryでテキストファイルを表示する</title>
<script src="js/jquery.min.js"></script>
<script>
$(function() {
$("#read_text").load("sample_txt.txt");
});
</scri...続きを読む

Aベストアンサー

ANo1です。

私の環境(windows)でも、サーバでは当然ながら問題はありませんが、ローカルでは、IEはOSがアクセスを拒否、fxでは.load()は実行できますが、$.get()では処理でないという、似たような事象が発生しました。

$.get()の場合、fxではsuccessが返されましたが、何も表示されないので、さらに調べてみると、dataTypeを自動設定にしておくとXMLと解釈されているようで、テキストは空文字列になっているみたいでした。
(OSからどのようなヘッダが返されているのかなどはわかりません)

質問者様の環境ではparsererrorとのことですので、statusこそ異なりますが、同様の事象が起きているではないかと想像します。
.load()では、内部処理で(想像ですが)dataTypeをhtmlかtextに決め打ちしているのではないかと思い、(ANo1でも回答しましたように)textを明示的に指定してみたところ、$.get()でも、$.ajax()でも表示することができるようになりました。
質問者様の環境では、この方法でもうまくいきませんか?

とはいうものの、ローカルでのアクセスは、実行できたとしても正しいアクセスとは言えないでしょうから、どのような環境でも同じ結果になるなどという保証はないと思いますが。
(専門家ではなく、全くの門外漢ですので理屈や仕組みはさっぱりわかってません。(汗)

ANo1です。

私の環境(windows)でも、サーバでは当然ながら問題はありませんが、ローカルでは、IEはOSがアクセスを拒否、fxでは.load()は実行できますが、$.get()では処理でないという、似たような事象が発生しました。

$.get()の場合、fxではsuccessが返されましたが、何も表示されないので、さらに調べてみると、dataTypeを自動設定にしておくとXMLと解釈されているようで、テキストは空文字列になっているみたいでした。
(OSからどのようなヘッダが返されているのかなどはわかりません)

質問者様の環境...続きを読む

Qローカルのtest.txtを1行ずつ読み込みたい

javascriptでローカルのtest.txtを1行ずつ読み込みたいため、ネットでtxtファイルの読み込みのコードを
探したら、自分のやりたいのに一番近いなと思う

http://www.happy2-island.com/vbs/cafe02/capter00 …

が見つかりました。

しかし、貼り付けて実行しても何も表示されません。

objParm(0)を"test.txt"
objFileSys.BuildPath(strScriptPath,strFileName)を
"file:///C:/Users/aaa/Documents/javascript"に
WScript.echoをdocument.write
とかに書き換えてみても、test.txtの中身が表示されません。

他にも検索するのですが、ネット上のtxtファイルの読み込み方とか
いまいちなコードしか検索ででてこず困っています。

test.htmlと同じローカルのディレクトリにあるtest.txtを読み込みたいのです

どのように書けばいいのでしょうか。
アドバイスいただけるとうれしいです。

javascriptでローカルのtest.txtを1行ずつ読み込みたいため、ネットでtxtファイルの読み込みのコードを
探したら、自分のやりたいのに一番近いなと思う

http://www.happy2-island.com/vbs/cafe02/capter00 …

が見つかりました。

しかし、貼り付けて実行しても何も表示されません。

objParm(0)を"test.txt"
objFileSys.BuildPath(strScriptPath,strFileName)を
"file:///C:/Users/aaa/Documents/javascript"に
WScript.echoをdocument.write
とかに書き換えてみても、test.txtの中身が表示されません。

他に...続きを読む

Aベストアンサー

androidも視野にいれるとなれば、
・イントラネットにWebサーバーを置く(XAMPPとか)
・Webコンテンツとして作成する
・イントラネットにWifi環境を構築して、androidでwifi経由でイントラwebサーバーにアクセス
・オフラインで使用したい場合は、コンテンツをHTML5のアプリケーションキャッシュで実装する
ってところじゃないでしょうか?

Qhtml で 変数を定義できますか?

html(できればjava不使用)で変数に文字列をいれてつかう、またはそれに近いことはできないでしょうか?

例**************************
$color1="#000000"

<tr bgcolor=$color1>内容1<tr>
<tr bgcolor=$color1>内容2<tr>
****************************
みたいな感じです

Aベストアンサー

調べりゃ分かることは???だけど。

CSS2で無理やり作れば・・簡単だけど・・・
生成内容、自動番号振り、リスト ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/generate.html )
 本来はXSLTで作るほうがよいかと・・・
 <th><xsl:value-of select="parson" />の歌</th>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>サンプル</title>
<meta name="author" content="ORUKA1951">
<meta http-equiv="Content-Style-Type" content="text/css">
<link rev="made" href="mailto:orika1951@hoge.com" title="send a mail" >
<link rel="START" href="../index.html">
<style type="text/css">
<!--
.parson1:before{content:"田中";}
p.age1:after{content:"36歳";}
-->
</style>
</head>
<body>
<h1>サンプル</h1>
<p class="parson1">は男の子</p>
<p class="parson1 age1">の年齢は</p>
<p>私の彼氏は<span class="parson1">君だよ</p>
</body>
</html>

調べりゃ分かることは???だけど。

CSS2で無理やり作れば・・簡単だけど・・・
生成内容、自動番号振り、リスト ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/generate.html )
 本来はXSLTで作るほうがよいかと・・・
 <th><xsl:value-of select="parson" />の歌</th>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="content-type" content="text/html; charset=Shift_JIS">
<title>サンプル</title>
<met...続きを読む

QonClickに複数の関数を挿入する方法

初心者なのですがアニメーションの関数anime1、anime2、anime3を作成し、onClickに下記のように設定しました。
クリックするとアニメーション2つの設定ではは動くのですが、3つ目を設定すると動かなくなります。
通常はこのような設定はしないものなのでしょうか?
教えてください。
よろしくお願いします。
<INPUT type="button" value="START" onClick="anime1(), anime2()">・・・OKです。
<INPUT type="button" value="START" onClick="anime1(), anime2(),anime3()">・・・動きません。

Aベストアンサー

セミコロンでつなぐのが常道ですが、3つ以上なら
別途function化したほうが、可読性が高くなると
思います。

QHTMLフォームのSELECTの幅を一定にするためには?

HTMLフォームのSELECTの幅を一定にするためにはどのようにすれば
いいのでしょうか?

CSS等で設定できるとありがたいのですが、やり方がわかりません。

Aベストアンサー

<select style="width: 200px">


このQ&Aを見た人がよく見るQ&A

人気Q&Aランキング