ホームページ >ウェブフロントエンド >jsチュートリアル >jsファイルにパラメータを渡す（詳しく解説）_javascriptスキル

jsファイルにパラメータを渡す（詳しく解説）_javascriptスキル

WBOYオリジナル: 2016-05-16 16:42:071603ブラウズ

1. グローバル変数を使用する

これは Google Adsense などの最も簡単な方法です:

4ec11beb6c39d0703d1751d203c17053 google_ad_client ='pub-3741595817388494'; dbee69d91dfbc6b08f31d07091607e422cacc6d41bbb37262a98f745aa00fbf0

欠点は、グローバル変数が導入されることです。ファイルを導入する方法には 2 つの方法があります:

// 变体1：用document.write输出
 <script type="text/javascript"> google_ga_id ='g6u7un8646xx'; 
document.write(unescape('%3Cscript type="text/javascript" src= "http://www.google-analytics.com/ga.js"%3E%3C/script%3E')); </script> 
// 变体2：用DOM操作append到head里 
<script type="text/javascript"> 
G_BEACON_ATP ='category=&userid=&channel=112ad_id=';
 document.getElementsByTagName('head')[0].appendChild(document. createElement('script')).src='http://taobao.com/atp.js'; 
</script> // 注意：上面的代码是根据实际应用虚拟的示范代码

注: バリアント 1 には多くの用途があります。一般的な記述方法は次のとおりです。

<script type="text/javascript"> 
// 直接转义即可： 
document.write('<script type="text/javascript" src="test.js"></script>'); 
// 或者像Yahoo!首页一样： 
document.write('<scr'+'ipt type="text/javascript" src="test.js"></scr'+'ipt>');
</script>

2. スクリプト要素の src を取得して解析します

すべての変数と比較して、次のようなパラメーターを渡すことを好みます:

13ae44ffe4aa4df7af013a12fb8158d82cacc6d41bbb37262a98f745aa00fbf0

中心的な問題は、src 属性を取得する方法です。

方法 1 は、スクリプトに id 属性を追加し、id を通じて現在のスクリプトを取得し、正規表現を使用して src からパラメータを抽出することです。欠点は、HTML 4.01 仕様では、SCRIPT 要素に id 属性がないことです。結局のところ、この欠点は欠点ではありません。標準がないよりも標準を信じる方が良いのです。

方法 2 は、js ファイル名をフックとして使用し、js コードで document.getElementsByTagName('script') を渡した後、現在の js ファイルを正規表現によって照合します。この方法は非常にオーソドックスですが、独自のファイル名が必要です。欠点は、コードが多く、洗練されておらず、パフォーマンスにわずかな影響を与えることです。

方法 3 は方法 1 に基づいており、単純にカスタム属性データを追加します。

94c14f1ae29f3592bfda9eb585dbd14b2cacc6d41bbb37262a98f745aa00fbf0

test.js ファイルで、次の行から受信パラメータを取得します:

var scriptArgs = document.getElementById('testScript').getAttribute('data'); 4 番目の方法は、js の順次実行メカニズムを使用することです (js ファイルは同期または非同期でロードできますが、実行するとドキュメントフローで順次実行される必要があります)。 js ファイルが実行されるときは、「読み込まれた」js ファイルの最後のものである必要があります:

var scripts = document.getElementsByTagName('script'); var currentScript = scripts[scripts.length - 1];方法 4 は方法 2 よりも賢くて天才的です。

コードの簡素化とパフォーマンスの点では、方法 3 > 方法 1 > 方法 2

要約: 標準を重視する場合は、方法 4 をお勧めします。私と同じように、標準に完全に準拠する必要を感じない場合は、方法 3 をお勧めします。

テストプログラムを書く

<!DOCTYPE html>
<html>
<script src="a2.js">
</script>
<script src="a2.js">
</script>
<script src="a2.js">
</script>
</html>

a2.js

var scripts = document.getElementsByTagName('script'); var currentScript = scripts.length;alert(currentScript);

別途印刷してください

1 2 3

3. インスピレーションプラン

あなたが私と同じように John Resig の忠実なファンなら、昨年 8 月に話題になった「スクリプトタグの劣化」をまだ覚えているかもしれません。 John Resig は私たちに想像力の扉を開きました。この記事の問題については、次のような「邪悪な方法」を使用して解決することもできます。

ae47fa971796540d6040c77d18703721 TB.SomeApp.scriptArgs ='a=b&c=d';

test.js ファイル内:

TB = {}; TB.SomeApp = {}; 
var scripts = document.getElementsByTagName("script");
eval(scripts[ scripts.length - 1 ].innerHTML);

このようにして、パラメーターは TB.SomeApp.scriptArgs 変数に保存されます。

パラメータがあまりない場合は、次のようにすることもできます:

ae47fa971796540d6040c77d18703721a=b&c=d2cacc6d41bbb37262a98f745aa00fbf0

js ファイル内:

var scripts = document.getElementsByTagName("script"); 
var scriptArgs = scripts[ scripts.length - 1 ].innerHTML.replace(/[s]/g, '');

想像力は無限です。onload も使用できます:

3959d0a17b69883088dd6228aa01b50a2cacc6d41bbb37262a98f745aa00fbf0

js ファイルで関数を定義するだけです:

TB = {}; 
TB.SomeFun = function(arg) { 
//code
};

上記のコードは、IE 以外のブラウザでも正しく実行できます。愚かな IE の場合は、数行のコードを追加する必要があります:

if(window.ActiveXObject) { 
var scripts = document.getElementsByTagName('script'); 
eval(scripts[scripts.length - 1].getAttribute('onload'));
}

声明：

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

前の記事：JQuery1.8 要素がevent_jqueryにバインドされているかどうかを判断するメソッド次の記事：JQuery1.8 要素がevent_jqueryにバインドされているかどうかを判断するメソッド

続きを見る

jsファイルにパラメータを渡す（詳しく解説）_javascriptスキル

関連記事