代碼處理（客戶端而不是服務器上）

Question

我想生成一個可以輸入代碼（例如HTML，CSS和JS）的開發工具，它將創建一個預覽/結果窗口（如JSFiddle）。 我將在學校中將其用於教程，並且需要一個獨特的網站來進行此操作（我很想使用CodePen，JS Fiddle或Codecademy ...但我不能）。

我能夠生成一個可以處理並顯示在iframe中的表單（通過PHP，它只是將信息回顯到iframe中顯示的新html文件中）。 但這帶來了問題。 我只有一台便宜的服務器，不想對它施加太大的壓力，因此需要通過JS / jQuery來完成。

首先這可能嗎？ 以及我將如何去做（代碼示例會很棒！）？

在此先感謝（如果我沒有提供足夠的細節，我表示歉意，但我對此很陌生，可能只是問一個毫無意義的問題（我只有15歲：/））

干杯:)

Answer 1

如果要像jsfiddel一樣在客戶端/瀏覽器中完成此操作，則需要2個或更多幀。 一種用於您的代碼，另一種用於輸出。

如果單擊“運行”，則需要將代碼應用於框架。 您可以通過訪問框架的document對象來執行此操作。 如果知道了，則需要在此處注入代碼。 網絡上有許多示例，涉及如何從框架/ iframe訪問子document對象。

Answer 2

有一個相當不錯的項目php.js ，它將使您能夠在瀏覽器中解析並執行PHP代碼的子集。