如何在iframe中顯示呈現的Handlebars模板

Question

由於各種原因（單獨的CSS，輕鬆加載資源等），我想在iframe中顯示呈現的Handlebars模板。我會用Javascript來做這件事。我怎樣才能做到這一點？

我已經試過如下：

1. 追加的iframe元素與src集到車把文件，然後使用jQuery /把手搶body的內容，編譯它，並把它回到iframe。

   • 的這裏的問題是，DOM是從靜態.hbs文件不同，我更願意使用原始hbs文件。例如，一些腳本可能被注入，而這往往會導致事情發生。

2. 追加與src組的iframe元件about:blank，使得對於車把文檔的ajax請求，編譯，然後將其附加到iframe的身體。

   • 的這裏的問題是，從服務器獲取資源時資產使用iframe的src屬性，因爲它沒有設置，資源不能定位。如果我在執行此步驟後更改src，則會重新加載整個iframe。

Answer 1

這篇文章上的斑點/ Bloburls可以幫助你：https://developer.mozilla.org/en-US/docs/Web/API/Blob

這基本上是它如何工作的：

var iframe = document.getElementById('myframe'); 

// Create a new Blob using your data and handlebars template 
var blob = new Blob(['<div>Hello World</div>'], {type : 'text/html'}); 

// create a URL from your new blob 
var url = URL.createObjectURL(blob); 

// Set your iframe to show the Bloburl 
iframe.src = url; 

（http://jsfiddle.net/83PQs/）

支持，這是Chrome，SF，FF和IE10（http://caniuse.com/#feat=bloburls）。