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 + ';">';
	}

使用HTML标记内的JS变量在Javascript中动态创建HTML

1 个答案: