使用Javascript創建和傳遞HTML

-1

我使用的JavaScript工具提示構造函數允許HTML作爲其內容的一部分。我想寫一個幫助函數返回一個代表HTML的對象（因爲確切的HTML將取決於構造函數的輸入參數）。我怎樣才能做到這一點？（僞碼是這樣的：使用Javascript創建和傳遞HTML

function makeHTML(data1, data2){ 
    var HTML = "" 
    if (property holds){ 
     add the following to the HTML: 
      "<br>" + 
      "<b>" + "Constant " + "</b>" + "<br>" + 
      "<b>" + varibale + "! " + "</b>" + moredata1 + 
      "<br>" 
    } 
    if (another property holds){ 
     add the following to the HTML: 
      "<br>" + 
      "<b>" + "Constant2 " + "</b>" + "<br>" + 
      "<b>" + varibale2 + "! " + "</b>" + moredata2 + 
      "<br>" 
    }

）。我遇到了一些試圖返回標籤和報價的問題。

當我填充工具提示沒有動態創建HTML內容，正確的格式在引號標記（如「」）：

return { 
     title: information 
     content: 
     "<br>" + 
     data[9] + variable + "<br>"

} 現在，我希望讓這個迴歸之前，我可以打電話makeHTML寫：

var dynamicHTML = makeHTML(data1, data2) 
return { 
    title: information 
    content: dynamicHTML 
}

來源

2017-03-19 user7518095

你爲什麼不只是HTML存儲在任何一個數據 - 屬性，或者在兄弟節點你的HTML（隱藏）。這樣工具提示和需要工具提示的東西就在一起。 –

您可以創建一個outputing前前接受數據的對象：

function dynamicElement(){ 
    var self = this, html = ""; 

    self.setProp = function(props){ 
     for(prop in props){ 
      html += "<p>"+prop+"</p>"; 
     } 
    } 

    self.draw(where){ 
     where.innerHtml = html; 
    } 

    return self; 
} 

//Usage 
var x = new dynamicElement(); 

x.setProp([1,2,3]); 
x.draw(document.body);

來源

2017-03-19 00:54:35

您可以使用document.write("your html here")。

但是，如果這是你發現你經常做什麼，你mgiht要使用服務器端腳本與PHP，或使用一些JavaScript庫/框架，如Angular或React。

來源

2017-03-19 00:45:41

壞主意。這將完全覆蓋DOM。 –

爲什麼你不使用element.innerHTML = myHTMLValue;？讓我們在這裏看到的更多信息：HTML DOM innerHTML

來源

2017-03-19 00:45:52 Sanosukeyy

「內容」是指工具提示的內容。我正在用Javascript寫信並從API中提取信息。我的目標是能夠使用條件邏輯編寫HTML並將此HTML傳遞到工具提示構造函數的內容字段中。 – user7518095

如果您創建了自己的邏輯並創建了HTML內容，則可以將其提供給您的HTML文件並進行顯示。想象一下，第一種對象有'a'條件，例如你創建'element.getElementById（'test'）。innerHTML =

'第一個

'，第二個有'b'條件，你可以做同樣的事情另一個標籤。 – Sanosukeyy

@ user7518095我在[JSFiddle]中創建了一個例子（https://jsfiddle.net/axg4trrp/） – Sanosukeyy

使用Javascript創建和傳遞HTML

回答

相關問題