ホームページ > 記事 > ウェブフロントエンド > スクリプトを介して構成パラメーターを渡す方法 カスタム属性_JavaScript スキル
私は正式なキャリアを始めたばかりです。ここ数日間、会社の統合ヘッダー JS に取り組んでおり、スクリプトのカスタム属性を介して構成パラメーターを渡す方法を思いつきました。
JS プラグインを作成する場合、プラグインを使用するには、まず HTML にプラグイン JS を導入し、次に script タグを追加してその中で呼び出す必要があります。映像切り替えプラグインなど。コードはおおよそ次のとおりです:
$.fn.picSwitch = function(option){ //这里是图片切换的代码 }
プラグインを導入した後、別のスクリプト タグに呼び出しコードを追加する必要があります
$('#pic').picSwitch({ 'speed' : '400', 'derection' : 'left' //... 这里是配置 })
もちろんこれで問題はありませんが、script タグを追加するだけの場合、設定パラメータをどのように渡せばよいでしょうか。
現時点では、スクリプトのカスタム属性を使用して構成パラメータを渡すことができます。これを行う前に、まず画像切り替えプラグインを処理する必要があります。変更されたコードは次のとおりです:
$.fn.picSwitch = function(){ //这里是图片切换的代码 };
//プラグインを作成した後、直接呼び出します
$('ここにセレクターがあります。これは script タグで取得する必要があります').picSwitch('ここに設定パラメータがあります。これは script タグで取得する必要があります');
<head> <script src='/script/picSwitch.js' id='picSwitch' obj='#pic' option='{"speed":"400","derection":"left"}'></script> </head> <body> <div id="pic"> //这里是具体结构 </div> </body>
$.fn.picSwitch = function(){ //这里是图片切换的代码 }; //写好插件后就直接调用 var script = $('#picSwitch'),//标签上的id selector = script.attr('selector'), option = JSON.parse(script.attr('option'));//标签上的是字符串需要转为json对象 $(selector).picSwitch(option);