外部の JavaScript ファイルを動的にロードし、スクリプトのメソッドを DOM の特定の要素にバインドできるようにしたいと考えています。それは可能ですか?どのように?どのような制約がありますか?
解決策は次のようになると思いますが、機能するものなら何でも受け入れます。
<html><body>
<div class="A">aaaaa</div>
<div class="B">bbbbb</div>
<div class="A">aaa</div>
</body></html>
<script type="text/javascript">
//This is the internal script, part of the original page
$.get("url/outside_script.js",
function(script_obj){
$(".A").bind('niftyMethod', script_obj.niftyMethod)
}
);
</script>
外部スクリプトは次のとおりです: outside_script.js
<script type="text/javascript">
var script_obj = {
niftyMethod : function(){
//Do cool stuff in the context of a DOM object.
$(this).fadeOut(500,function(){$(this).fadeIn(500)});
}
</script>
私はこれについてグーグルでかなりのことをしましたが、あまり見つかりませんでした。もしかして検索ワード間違ってる…?
注: 必要であれば jquery を喜んで使用します。