javascript - 如何使用javascript在ul标签中创建元素li img标签?

标签 javascript jquery html css

如何使用 javascript 在 ul 标签中创建元素 li img 标签?

我要创作

<li id="123">
    <img src="https://upload.wikimedia.org/wikipedia/commons/5/53/Loading_bar.gif"/>
</li>

内部

<ul id="placehere">

但是不行,我该怎么做?

https://jsfiddle.net/btz69dyk/2/

<body>
<script type="text/javascript">
window.onload=function(){

var elem = document.createElement("li");
elem.setAttribute("id", "123");

var elem = document.createElement("img");
elem.setAttribute("src", "https://upload.wikimedia.org/wikipedia/commons/5/53/Loading_bar.gif");
elem.setAttribute("height", "");
elem.setAttribute("width", "");
elem.setAttribute("alt", "Flower");
document.getElementById("placehere").appendChild(elem);
}
</script>
<ul id="placehere">
</ul>
</body>

最佳答案

问题是这 4 行

var elem = document.createElement("li");
elem.setAttribute("id", "123");

var elem = document.createElement("img");
elem.setAttribute("src", "https://upload.wikimedia.org/wikipedia/commons/5/53/Loading_bar.gif");

这里您再次使用相同的变量名创建相同的 elem 元素,因此 li 丢失了

改成

var elem1 = document.createElement("li");
elem1.setAttribute("id", "123");

var elem = document.createElement("img");
elem.setAttribute("src", "https://upload.wikimedia.org/wikipedia/commons/5/53/Loading_bar.gif");
elem.setAttribute("height", "");
elem.setAttribute("width", "");
elem.setAttribute("alt", "Flower");
document.getElementById("placehere").appendChild(elem1);
elem1.appendChild(elem);

关于javascript - 如何使用javascript在ul标签中创建元素li img标签?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35029574/

相关文章:

jquery - 如何从 HTML 中加载外部文件?

html - 不良做法 HTML/CSS 包装器

javascript - 在 Coldfusion CFC 中接收上传的文件

javascript - React - 如何访问数据集值

JQuery - 动画按钮

html - 如何在 div 内的内联链接之间均匀分配空间?

html - 在图像上 float Div

javascript - 如何避免 html 输入中出现 'NaN' 消息

javascript - 在 JQuery ajax beforeSend 中调用模态对话框收集一些信息

c# - 如何使用 jQuery 遍历我的 Json 响应?