我想问是否有一种更优雅的方法可以使用javascript而不使用jQuery将图像插入到html中:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
</head>
<body>
<script>
for(i = 0; i < 3; i++) {
name = i + "_img";
document.write("<img name=" + name + " />");
img = document.images[name];
img.src = i + ".png";
}
</script>
</body>
</html>
最终我会有更多的属性,并且我想尽可能避免使用 以使其更加透明。
最佳答案
您可以使用 document.createElement("tag")
在 JavaScript 中创建元素。例如,document.createElement("image")
。所以你不需要像你正在做的那样构造一个字符串。对于某些元素,例如图像,您也可以只执行 new Image()
。请记住,当您以这种方式创建元素时,它还不是 DOM 的一部分。您必须使用 appendChild
或其他方式添加它。
另外,我会避免使用 document.images[]
因为我不确定这是否完全跨浏览器友好。我相信标准做法是 document.getElementsByTagName("image")
,它返回一个可以迭代的数组。
var whereToAppend = document.getElementsByTagName("body")[0];
for(var i = 0; i < 3; i++) {
var name = i + "_img";
var img = new Image();
img.src = i + ".png";
whereToAppend.appendChild(img);
}
关于javascript - 在 JS 中优雅地创建图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8958274/