掲示板/JavaScript質問板/過去ログ/一覧/ このスクリプトの間違いがわからないです。

0 名前： 初心者 ： 2005/06/01 13:48: <xmp><html>
<head>
<script language="javascript"></script>
</head>
<body>
<font onClick="mu();">あああ</font>
<div id="aaa"></div>
<div id="bbb"></div>
</body>
</html></xmp>
<xmp><div id="bbb"></div></xmp>
を消すと上手く動作しますが、どこに間違いがあるかわからないです。

1 名前： Pid ： 2005/06/01 13:48: えーと…… HTML が致命的に間違っています (^^;)。

2 名前： U D ： 2005/06/01 13:48: まずこのスクリプトで何をしたいのかを教えて欲しいです。
どういう目的のスクリプトか分からないので指摘のしようがないっす。

んまぁ、というかそもそも、
<XMP></XMP>はタグとかも無視して内側にある文字列を表示するので、
エグザンプルタグがある時点で中のスクリプトは動作しないはずなので、
当然っちゃぁ当然ですが。。。

3 名前： Pid ： 2005/06/01 13:48: ひょっとして，xmp 要素としてのマークアップは，質問者さんが投稿時に気をきかせて入れて下さったのでしょうか……そう考えると辻褄が合うような (^^;)。

スクリプト自体は，おそらく aaa[n] = 'id, 変更文'; と指定して，クリック時にその id を持つ要素の内容を入れ替えるというものでしょう。

ただ，

・ HTML の xmp 要素はとっくの昔に廃止されている (^^;)
・ script 要素の language 属性も，もう廃止予定である
・ document.all() は IE4/NN4 のブラウザ拡張戦争時代の遺物

であることを考えると，内容的には相当古いですね。

UD さんが仰るように，「うまくいく」とはどういう場合で，「うまくいかない」とはどういうことなのか，具体的な動作が分からないと，これ以上は何とも言えません。

4 名前： 初心者 ： 2005/06/01 13:48: すみません、説明不足でした。確かに、xmpよりpreを使う方がよいと｢とほほさんのサイトhttp://www.tohoho-web.com/｣に書いてありました。でもこの掲示板はタグがそのまま表示されるんですね、便利♪。
えっと、クリックした時にIDを指定した要素の内容を変更するでほぼ間違いありません。
したい事というか目標は、
１エクセルのcsvファイルをJScriptを使い、JavaScriptの外部ファイルを出力します(配列aaaをここで作ります)
２で、｢要素のID名｣と｢挿入する内容｣を格納した配列aaaから、テーブルタグでレイアウトされた各divタグに内容を出力をします。
この２番の動作を担当する関数を作りたいです。
無理でしょうか…。

5 名前： 初心者 ： 2005/06/01 13:48: ----------------------------------------------
<html>
<head>
<script language="javascript"></script>
</head>
<body>
<font onClick="mu();">あああ</font>
<div id="aaa"></div>
</body>
</html>
----------------------------------------------
この時は正常というか、エラーなしに動作したのですが、
<div id="bbb"></div>の一行を追加すると
｢ページ内でエラーが発生しました｣や｢ランタイムエラーが発生しました。デバックしますか？行　エラー;'document.all(...)'はNullまたはオブジェクトではありません。｣というメッセージがでて動作しません。
ブラウザは多分、IE６使用です。

6 名前： Pid ： 2005/06/01 13:48: > １エクセルのcsvファイルをJScriptを使い、JavaScriptの外部ファイルを出力します(配列aaaをここで作ります)

この部分の意味がよく分からないので，具体的なコード等と一緒にもう少し詳しく説明して頂けますか。ActiveXObject を使っているのか，それとも TDC を使っているのか，それともサーバ側処理で出力しているのか。

> <div id="bbb"></div>の一行を追加すると……動作しません。

その一行を追加しても，上記のスクリプト「だけ」なら何ら影響は無いはずです。御提示下さったスクリプトには相当な省略があるとお見受けしますが，原因となる部分が含まれていないと思います。

できるだけ「問題が再現でき，こちらで検証可能な，最小限のコード」を提示して頂けると助かります（そのようにコードをまとめているうちに解決してしまった，ということもよくある話ですので）。

なお，いくつか気になった点としまして，

・<script language="javascript"> ではなく <script type="text/javascript"> （type 属性が必須）。

・変数は必ず var で宣言しておくこと。でないとグローバル変数になってしまいます。

・「IE4 にも対応したい」のでなければ，IE 独自の document.all() ではなく，公式の document.getElementById() を使用した方が良い。

7 名前： 初心者 ： 2005/06/01 13:48: >>>エクセルを使う
新JavaScript入門(http://homepage3.nifty.com/aya_js/wsh/wsh_frm.htm)のWindowsScriptingのコーナーの「2-TextFile」で紹介されています。JScriptとは簡単に言うとJavaScriptのセキュリティ制限を取り除いたようなプログラムかな…(ファイル出入力とかいろいろ便利)、詳しくはサイトに説明があります。そこで紹介されているように、CSVファイル(テキストファイル)を読み込むことが出来るので、
----------------------------------------------
ファイル000.csv
----------------------------------------------
サイト名,アドレス,紹介文
とほほ,http://www.tohoho-web.com/,WWW技術の紹介サイト
----------------------------------------------
bbb.js
----------------------------------------------
aaa = new Array();
aaa[0]="サイト名,アドレス,紹介文";
aaa[1]="とほほ,http://www.tohoho-web.com/,WWW技術の紹介サイト";
----------------------------------------------
エクセルで作成したファイル000.csvからbbb.jsを作れるんじゃないかと思いまして…。こうすると、たくさんのデータを扱う時、更新作業が便利です。

>>> <div id="bbb"></div>の一行を追加すると……動作しません。
書いたスクリプトに<div id="bbb"></div>を追加すれば、一切省略のないスクリプトになりますが、このスクリプトでエラーが出ます。

8 名前： Pid ： 2005/06/01 13:48: あ，なるほど。つまり，まず JScript + WSH（Windows Scripting Host）で 000.csv からデータを抽出し，データ処理用の bbb.js を作成する。次に，bbb.js を，データ表示・操作用の HTML 文書から読み込む，と。これらの作業は全てローカルで行われるわけですね。

で，調査のために，本来外部スクリプトである bbb.js を HTML 文書に直接書いたのが >>5 である，と。了解しました。

さて，私は「>>5 でエラーが出るはずが無い」と思い込んでいました（すみません m(_ _)m）が，>>5 が WinIE 専用のスクリプトということであれば，エラーにも納得しました。

> aaa = new Array();

変数 aaa は var で宣言されずにいきなり登場しましたので，WinIE は「この関数内のどこで宣言されたのだろう」と探し出します。もし，どこにも宣言が見つからなければ，aaa はグローバル変数として扱われます。

ところが，WinIE の仕様では document.all('aaa') を aaa と省略表記することができます。つまり，ここで WinIE は，aaa を文書内の「id="aaa" を持つ div 要素オブジェクト」と認識してしまったのです。

したがって，div 要素オブジェクトを new Array しようとすれば「オブジェクトでサポートされていないプロパティまたはメソッドです｣ということになりますし，さまざまな混乱が起きるでしょう。

変数名を id とかぶらないよう変更するか，var で宣言しておけばエラーは出なくなります。このように変数名が衝突することの無いよう，以前述べたことの繰り返しになりますが

・変数はきちんと var で宣言し，スコープが関数内限定であることを明示しておく。
・処理系に依存した省略表記は避ける。

のが基本です。

9 名前： Pid ： 2005/06/01 13:48: それから，質問の主旨からやや離れますが…。

もともと JavaScript は Netscape Communications 社が開発したものですが，

・JavaScript から，ブラウザ固有の部分を除去して標準化した仕様が ECMAScript
・ECMAScript に準拠した形で Microsoft 社が開発したのが JScript

です。ECMAScript 準拠の言語には他に ActionScript，FESI，Rhino といったものもあるようです。

また，ホストエンジンが提供するホストオブジェクトを組み込むことによって，J(ava)Script をさまざまに拡張することができます。

・ブラウザを操作する window オブジェクト
・ブラウザ内文書を操作する document オブジェクト
・PDF を操作する PDF/JavaScript
・（ファイル操作など）Windows 自身を操作するための Windows Scripting Host

などがその例ですね。

※なお，有名サイトということで敢えて申しますと，とほほ氏のリファレンスは記述が古く，出典が明らかでない妙な例文も多いので，私はお勧めしません。

10 名前： 初心者 ： 2005/06/01 13:48: 　とても丁寧な解説をありがとうございます。エラーの意味がやっとわかりました。きちんとした表記が出来るようになりたいですね。ネットにはそんな解説を懇切丁寧にしているサイトはあまり見かけないですし、とほほ氏のようなサイトを基準に考えても省略仕様などの関係でエラーを誘発してしまうと…。やっぱり、きちんとした書籍を購入して勉強するのが一番の近道なのかもしれませんね。もしよろしければ、学習用のよい書籍を紹介していただけませんか!?

>>処理系に依存した省略表記
何が処理系に依存した省略表記にあたるかわからないんですよね･･･。でも、WinIEにそんな仕様があったとは知りませんでした。

11 名前： Pid ： 2005/06/01 13:48: > 学習用のよい書籍を紹介していただけませんか

あくまで私の独断と偏見ですが…(^^;)。書籍であれば，O'Reilly の『JavaScript 第三版』（いわゆるサイ本）が，内容的には一番信頼できるのではないかと（むっちゃ高いですが）。Web ページであれば，

・http://www.parkcity.ne.jp/~chaichan/src/2ndthema.htm
・http://www.axis.t.u-tokyo.ac.jp/%7Eshunak/ecmascript/
・http://www.interq.or.jp/student/exeal/dss/

は比較的信頼性の高い内容です（ただ，どれも言語の経験者向けかもしれません）。また，HTML 文書をいろいろ操作するだめの DOM（Document Object Model）に関しては

・http://east.portland.ne.jp/%7Esigekazu/css/javascript.htm
・http://www2u.biglobe.ne.jp/%7Eoz-07ams/prog/dom-ref/object-index.html

を紹介しておきます。ただ，DOM を使う場合は「正しい」HTML と CSS の知識が前提となりますので，

・http://www.kanzaki.com/docs/htminfo.html
・http://openlab.ring.gr.jp/k16/htmllint/htmllint.html

を合わせてどうぞ。もし CSS に自信が無ければ，先に CSS をマスターしておいた方が良いと思います。

> WinIEにそんな仕様があったとは知りませんでした。

実は，これも明文化されているわけではありません（にもかかわらず，いろんな「サンプル配布」系サイトで用いられており，WinIE 専用のスクリプトの大量生産の原因になっている）。MSDN のリファレンスでは，HTC コンポーネントでビヘイビアを作成する場合には document オブジェクトが「存在しない」とされているのですが，WinIE の実装ではいろんなものがごっちゃに実装されている印象を受けます…。