中国の習慣では、旧暦の1月15日より前に新年を祝います。ここで、庭にいる友人たちに新年の幸せを祈りたいと思います。 コードをコピー コードは次のとおりです。<html> <title>デモ</title> <ヘッド> <script type="text/javascript" src="swfobject_source.js"></script> <script type="text/javascript"> var so = new SWFObject("http://www.pec365.com/Flash/20071113.swf", "mymovie", "304", "367", "7", "#FFFFFF"); 次のように記述します。 </スクリプト> </head> <本文> <フォームid="フォーム1"> <div id="flashcontent"> <a href="http://www.adobe.com/go/getflashplayer"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Adobe Flash Player を入手" border="0" /> </a> </div> </フォーム> </本文> </html> SWFObject() の各パラメータの意味を簡単に理解したい場合は、ドキュメントを参照してください。ここでは繰り返しません。 「V1.5 使用例」のコードをメモ帳にコピーし、SWFObject V1.5 をクリックして、V1.5 フレームワークの必要なソース ファイルをダウンロードすることを強くお勧めします。解凍後、swfobject_source.js (非圧縮バージョン、圧縮バージョンのファイル名は swfobject.js) ファイルを見つけ、メモ帳ファイルの名前を demo.html に変更して、swfobject_source.js ファイルと同じフォルダーに配置し、IE6/IE7、fox、opera、safari、navigator、chrome などの任意のブラウザーで実行して結果を確認します。 私のアドバイスに従った場合、ページにこの画像が表示されるはずです。 ![]() VS 2003/2005/2008 シリーズの IDE を開発に使用している場合は、JavaScript コードのデバッグ方法を教える必要はないと思います。var so = ... の上にデバッガーを配置し、デバッグしてトレースすることができます。so.write() メソッドを介して swfobject_source.js ファイルの内部までトレースするまで、F11 キーを押し続けます。document.getElementById("flashcontent") が使用されている場合、so.write(elementId) に渡される実際のパラメーター "flashcontent" は常に null であることがわかります。これはなぜでしょうか。問題は見つかりましたか? ハハ、まだ JavaScript をあまり知らない初心者なら、当時の私と同じように混乱するでしょう。何度もデバッグとコード修正を繰り返した結果、私が書いた JS コードには間違いがないと確信しています。外部から読み込んだ swfobject_source.js ファイルに問題があるのでしょうか? 問題があるとしたら、何が問題なのでしょうか?その時、私はエラーの解決策を見つけようとしました。上記のコードを次の例のように変更しました。 コードをコピー コードは次のとおりです。<html> <title>デモ</title> <ヘッド> <script type="text/javascript"> // 無名関数の実行は通常の関数の実行と変わりません (関数() { var flash = document.getElementById("flashcontent"); var メッセージ = null; window.onload = 関数() { if (フラッシュ) { msg = '要素は存在します。'; flash.innerHTML = メッセージ; } それ以外 { msg = '要素が存在しません'; ウィンドウ.アラート(メッセージ); } }; })(); </スクリプト> </head> <本文> <フォームid="フォーム1"> <div id="flashcontent"> <a href="http://www.adobe.com/go/getflashplayer"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" _fcksavedurl=""http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"" alt="Adobe Flash Player を入手" border="0" /> </a> </div> </フォーム> </本文> </html> 上記のコードを実行すると、画像がページに表示されたままであることがわかります。 ![]() これを読めば、当時の私のイライラをきっと理解できるでしょう。少し休憩して頭をすっきりさせて振り返ってみると、問題の本質は「HTML DOM の読み込み」にあることがわかりました。ページでは、HTML DOM が実際に構築される前に、ページ ヘッド (<head></head> の間) 内の JS スクリプトと外部ファイルから読み込まれた JS ファイルが実行されます。そのため、この 2 つの場所で実行されるスクリプトは、まだ存在しない DOM にアクセスできません。本当の理由を知っておく必要があります。つまり、例 1.1 の JS コードの実行中に、<div id="flashcontent">……</div> が構築される前にアクセスされたのです。 さて、最後に自分で行う必要があるステップが 1 つあります。それは、上記のコードを単純に変更し、エレガントでない方法で「HTML DOM の読み込み」の問題を解決することです。その方法は何でしょうか? もうお分かりだと思います。そうです、次の方法です。 コードをコピー コードは次のとおりです。<html> <title>デモ</title> <ヘッド> <script type="text/javascript" src="swfobject_source.js"></script> _fcksavedurl=""swfobject_source.js"></script>" </head> <本文> <フォームid="フォーム1"> <div id="flashcontent"> <a href="http://www.adobe.com/go/getflashplayer"> <img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Adobe Flash Player を入手" border="0" /> </a> </div> </フォーム> <script type="text/javascript"> var so = new SWFObject("http://www.pec365.com/Flash/20071113.swf", "mymovie", "304", "367", "7", "#FFFFFF"); 次のように記述します。 </スクリプト> </本文> </html> 上記の数千語は、私がどれだけ回り道をしたか、問題を解決する過程で遭遇したトラブル、そのトラブルからどのように抜け出したか、学んだ知識を活用し、また学んだかを述べているだけです。少し面倒ですが、私と同じように何か得たものはありますか? |
>>: React Router 5.1.0 はページジャンプナビゲーションを実装するために useHistory を使用します
目次1. はじめに2. コンポーネント開発1. コンポーネントの構成2. ヘッダーコンポーネントの開...
この記事の例では、カスタムスクロールバーを実装するためのjsの具体的なコードを参考までに共有していま...
この記事では、ブルーグリーン デプロイメントと、nginx を使用してカナリア リリースを最も簡単な...
ポップアップは、現在のウィンドウにメニューツールバーがあるかどうかとは関係ありません。ページにスクリ...
目次間違い1: データの列が多すぎる誤解2: 共同クエリが多すぎる誤解3: ENUMの代わりにSET...
1. ソフトウェアの紹介バーチャルボックスVirtualBox は、無料のオープンソース仮想マシン ...
1. セマンティゼーションとは何ですか? Bing辞書の説明セマンティクス化とは、適切な HTML ...
MySQL のデータはディスクに書き込む必要があることは誰もが知っています。ディスクの読み取りと書き...
CSSファイルに書き込むコードをコピーコードは次のとおりです。 01.html {グレイスケール(1...
1. ソースコードの設計コードをコピーコードは次のとおりです。 <!DOCTYPE html ...
NodeJS は次のファイルをコピーします:通常、小さなファイルのコピー操作では、ストリーム パイプ...
目次1. nginxのインストールと操作(Mac OS環境) 2. nginxルールの設定3. コマ...
目次Centosイメージを取得するCentos ベースの nginx コンテナを生成するCentos...
MySQL の運用と保守において、R&D の同僚が 2 つの異なるインスタンスのデータを比較...
登録するフロントエンドは、vue の axios を使用して値を渡し、取得したアカウントとパスワード...