通過瀏覽器/服務器語言獲得html元素結構的最佳方式是什麼？

Question

目前我是呼應使用php的html元素。其他時候，我需要使用JavaScript並且創建這些元素dinamically（例如，在移動工作的一些功能不同，並需要在DOM中的一些調整）。不幸的是，我在代碼中跨越了兩個不同維度的元素（或更多），如果我想更改某些內容，則需要更新所有這些維度。作爲一個例子：

流長輪詢與JavaScript（jQuery的）：

...append("<div></div><div></div><div></div><div></div>"); 

PHP回聲其他

echo "<div></div><div></div><div></div><div></div>"; 

東西在PHP與每個回波

foreach(...){ 
    echo "<div></div>";echo "<div></div>"; 
    (...) 
    foreach(...){ 
     echo "<div></div>"; 
     echo "<div></div>" 
    } 
} 

如果我想改變這個元素的結構我將不得不改變ALL的3種情況，從4 divs到2 divs或1例如。我到底能夠在php和javascript中集中所有這些元素？我想在PHP中有一個字符串，並將其作爲模板 JavaScript，但由於串聯造成動態類和其他屬性時，它會變得混亂。有誰知道另一種方式來做到這一點？

Answer 1

PHP

的最有效的方式來輸出HTML與PHP是一個變量聚集的一切，一次打印出來。

$html = ''; 

foreach ($rows as $key => $value) { 
    $html .= $value; 
    // You may nest loops as long as you want. 
} 

print $html; 

這裏是關於創建一個簡單的模板How to make a simple HTML template engine in PHP

的JavaScript 我不能涉及到jsperf.com，因爲它是向下的文章。但追加HTML節點的最有效方法是在追加前創建它們。該方法在What is the most efficient way to create HTML elements using jQuery?

// The fastest you could get. 
$(document.createElement('div')); 

// That's for your case. 
$("<div></div><div></div><div></div><div></div>").appendTo(target); 

很難建議在其技術，您應重點說明，這主要取決於你的優先權。有些網站是靜態的，並將其HTML存儲在靜態HTML文件中，例如。 Jekyll

有些網站是如此充滿活力，改變了很多用戶的輸入，對客戶端渲染HTML最好的圖書館之一是React.js

如果您的網站是靜態的，然後進行簡單的模板引擎在PHP中，如果您的網站依賴用戶輸入很多，然後去React.js，但甚至沒有想到用jQuery做前端渲染，你會浪費你的時間。

如果React.js看起來太複雜了，我會建議使用Mustache Templates