menu


2016年10月4日火曜日

htmlの中にhtmlを読み込み表示させる(javascript)



html内のある一部に共有のhtmlを表示させたいって事ありませんか?
この場合、インラインフレーム <IFRAME>を使う方法が、考えられます。
これも一つの方法です。
しかし、無料サーバーを使ってサイトを作っていると、htmlに広告が表示されたりしてしまい、インラインフレーム <IFRAME>の中にまで広告が出力されたりします。
そこで、ファイルとして読み込み、表示させる方法をとります。
やり方は、簡単です。
表示させたい場所に<div id="hyouji"></div>と書き込み、この場所にjavascriptでファイルを読み込み表示させます。
表示させたいhtmlをテキストファイルで作成し、読み込み表示させるだけです。
いたって簡単です。私は、サイトの広告表示に使っています。サイズの同じ広告を複数用意して、テキストファイルに保存し、毎回ランダムに読み込むファイルを変えて読み込みます。
実際には、csvファイルにして、件数でランダム発生させて、表示広告を変えています。これにより、広告が増えても、csvファイルの更新だけで、サイトの編集をせずに広告変更が可能に成ります。
サイトの自動化を考えた方法です。
以下に関数のソースを載せます。

読み込んで書き出すだけの処理ですが、結構使えます。 私のサイトは、ほとんどこれの応用です。読み込み部分は、csvの読み込みでも使用していますし、htmlの出力部分は、javascriptの基本です。
使い方は、htmlの最初にjavascriptで関数を定義して、書き込みしたい場所の下でjavascriptで関数を実行します。
htmlは、上から下へと処理しますので、書き込みを定義きた場所より先に実行すると、書き込み場所が見つけられず、実行できません。
静的なhtmlを動的に見せるのに使える処理です。