使用HTML標簽內的JS變量在Javascript中動態創建HTML

Question

我正在嘗試使用HTML標簽中的JS變量使用JavaScript動態創建HTML代碼。 然后，代碼通過.innerHTML插入到我的HTML文件中。

什么不起作用（我沒想到它確實能起作用，但是我不確定如何強制它起作用）是將id和margin-right屬性設置為JS變量（分別使用dynamicID和equalMargin ）。

 var numberOfImages = 7 var equalMargin = 1; //(divElement.clientWidth - equalWidth*7) / 6; var dynamicCode = ""; var dynamicID = ""; var i; for(i = 0; i < numberOfImages - 1; i++) { dynamicID = "navDot" + i + ""; console.log(dynamicID); dynamicCode = dynamicCode + '<img src = "https://dl.dropboxusercontent.com/s/mvj24qzluobu098/seekDotEmpty.png?dl=0" alt = "emptyDot" id = dynamicID style = "max-height: 100%; margin-right = equalMargin;">'; } 

Answer 1

只需結束字符串，添加變量，然后重新打開字符串即可。

此外，屬性，等號（ = ）和它們的值之間沒有空格。

 var numberOfImages = 7 var equalMargin = 1; //(divElement.clientWidth - equalWidth*7) / 6; var dynamicCode = ""; var dynamicID = ""; var i; for(i = 0; i < numberOfImages - 1; i++) { dynamicID = "navDot" + i + ""; console.log(dynamicID); dynamicCode = dynamicCode + '<img src="https://dl.dropboxusercontent.com/s/mvj24qzluobu098/seekDotEmpty.png?dl=0" alt="emptyDot" id="' + dynamicID + '" style="max-height: 100%; margin-right: ' + equalMargin + ';">'; }