6

私は現在、Prototypeライブラリを使用する大きなサイトであるプロジェクトに取り組んでおり、すでに膨大な量のJavascriptコードがあります。

現在、他の人のサイトに「注入」されるコード（サイトに<script>タグを追加する人を想像してください）に取り組んでいます。このコードは、コードを実行し、一連のDOM要素と機能を自分のサイトに追加します。サイト。これには新しいコードが含まれ、メインサイトで使用する多くのコードも再利用されます。

私が抱えている問題は、もちろん、人々のページにプロトタイプを含める<script>を追加するだけではクールではないということです。すでに任意のフレームワークを使用しているページでそれを行うと、すべてを台無しにすることが保証されます。
jQueryには、$オブジェクトの「名前を変更」するオプションがあります。これにより、jQueryを使用していないという事実を除いて、この状況を適切に処理できるため、すべてを移行する必要があります。

今、私はいくつかの醜い選択を考えています、そして私は何が最善かわかりません...

  • どこでも名前が変更された$オブジェクトを使用して、jQueryを使用するようにすべてを書き直します。
  • 「注入された」コードで使用するサブセットのみを使用して「新しい」プロトタイプライブラリを作成し、$の名前を別の名前に変更します。次に、何らかの方法で共有されるコードの部分を適応させる必要があります。
  • 挿入されたコードでライブラリをまったく使用せず、可能な限りクリーンに保ち、ライブラリをまったく使用しないように共有コードを書き直します。これは明らかに私たちに退化して、ライブラリの独自のフランケンシュタインを作成します。これはおそらくこれまでで最悪のシナリオです。

私はあなたたちが私に何ができると思うか、そしてまた私のすべての問題を解決する魔法のオプションがあるかどうか疑問に思っています...

たとえば、Caja / Cajitaのようなものを使用して、自分のコードをサンドボックス化し、サイトの他の部分から分離して、その中にPrototypeを含めることができると思いますか？それとも私はそれで完全にポイントを逃していますか？

ブックマークレットのテクニックについても一度読んだことがありますが、次のようにコードを追加しましたか？

(function() {  /* your code */ })();

そして、コードはすべて無名関数内にあり、グローバル名前空間にはまったく触れていません。以下を含む1つのファイルを作成できると思いますか。

(function() { 
   /* Full Code of the Prototype file here */
   /* All my code that will run in the "other" site */

   InitializeStuff_CreateDOMElements_AttachEventHandlers();
})();

それはうまくいくでしょうか？たとえば、グローバル名前空間を乱雑にせず、jQueryを使用するサイトの機能を強制終了しないという目的を達成できるでしょうか。

それとも、プロトタイプが複雑すぎて、そのように分離できないのでしょうか。
（注：それはどこでもクロージャーを作成し、それは遅くなることを私は知っていると思いますが、私はパフォーマンスについてあまり気にしません、私のコードはそれほど複雑なことをしていません）

4

2 に答える 2

2

コードを他のサイトに挿入する場合は、プロトタイプも含めることを要求するか、ライブラリをまったく使用しないでください。

私の意見では、他のオプションはあまりにも邪魔です。

于 2009-08-05T03:40:11.220 に答える
0

ダニエル、

同じ理由で同じ問題に直面しています。おかげさまでjqueryが使えるようになりました。私がやりたいことは、jquery のインスタンスと必要な依存ライブラリをロードする単一の js ファイルを作成することです。次に、同じ方法で css をロードします。

これらのファイルを DOM にロードするスクリプトを見つけましたが、機能していないようです。これが私が使用しているものです：

function loadjscssfile(filename, filetype){
 if (filetype=="js"){ //if filename is a external JavaScript file
  var fileref=document.createElement('script')
  fileref.setAttribute("type","text/javascript")
  fileref.setAttribute("src", filename)
 }
 else if (filetype=="css"){ //if filename is an external CSS file
  var fileref=document.createElement("link")
  fileref.setAttribute("rel", "stylesheet")
  fileref.setAttribute("type", "text/css")
  fileref.setAttribute("href", filename)
 }
 if (typeof fileref!="undefined")
  document.getElementsByTagName("head")[0].appendChild(fileref)
}

css が読み込まれていることを firebug で確認できますが、css ファイルの内容が表示されません。この WIDGET が使用するツールに基づいて、必要なライブラリを動的にロードできることを期待していました。したがって、どのライブラリとcssファイルを「インポート」する必要があるかを決定するプログラムロジックを実行したいと思います。

この考え方があなたの努力に役立つかどうかはわかりませんが、私はあなたの考えを知りたいです.

于 2010-04-14T00:14:49.203 に答える