像UserVoice這樣的託管服務如何將其內容嵌入其他網站？

Question

像UserVoice這樣的託管服務如何將其內容嵌入其他網站？

我發現它是通過在服務提供商的頁面上包含一個JavaScript文件，但是我感興趣的是創建類似服務的構建塊。

例如，他們是否使用類似jQuery，mooTools或prototypejs的庫以及它們如何避免名稱空間衝突？

也想知道是否有任何書籍，文章，博客文章，這些特定的JavaScript的使用（不尋找JavaScript的一般資源）。

的問候和感謝提前，

艾略特

Answer 1

這是我在How to build a web widget (using jQuery)發現的一個很好的教程

Answer 2

一般情況下，你所描述的被稱爲「窗口小部件的JavaScript」（UserVoice的恰好出現在該頁面的側）。

有一個關於creating Javascript Widgets的好教程，你可以查看。

Answer 3

這樣的嵌入式服務的基本結構是：

1. 如果服務不要求腳本將被包括在頁面的底部，鉤身onload事件，不踩在任何現有的處理程序的腳趾上（通過攔截現有的處理程序功能，而這些功能又可以鏈接到其他功能上）。
2. 將新的HTML元素注入到文檔中。 HTML代碼很可能會作爲字符串文本內聯到腳本中，因爲在單個注入元素上設置innerHTML比使用函數調用的直接DOM操作更容易和更快。
3. 整個腳本應位於封閉內部以避免名稱衝突。
4. JS框架可能會也可能不會被使用;包含框架時需要小心，因爲它可能與先前存在的不同框架或同一框架的不同版本衝突。

Answer 4

EDT：一般來說，你會讓你的客戶端/客戶/好友包括在他們的網頁腳本，然後通過該腳本可以執行以下操作：

在純JS，你可以加載從遠程位置的腳本（或不那麼遙遠）動態通過

var script = document.createElement('script'); 
    script.type = 'text/javascript'; 
    script.src = 'your/remote/scripts/path.js'; 
    document.getElementsByTagName('body')[0].appendChild(script); 

// $ .getScript（'your/remote/scripts/path.js'）;在jQuery的，但你一定會的jQuery裝上遠程站點

然後腳本加載你可以像創建這樣

VAR體= document.getElementsByTagName元素執行不同的操作（「主體」）[0]; var aDiv = document.createElement（'script'）; /*在這裏您可以修改您的div屬性並查看*/ body.appendChild（aDiv）; // $（''）。appendTo（'body'）;對於jQuery

要深入瞭解JavaScript，您可以閱讀例如Javascript: The Good Parts或Definitive Guide To Javascript。