Question

使用javascript与createElement和appendchild合作。我正在尝试研究是否有可能将divs附加到他们的类，数据等等。我当前的脚本在<li>设置图像，我不会发布整个脚本（它很长），因为这是我认为我需要帮助的部分，这是当前的功能：

function showUploadedItem (source) {

var list = document.getElementById("index-slider-list"),
li   = document.createElement("li"),
remove   = document.createElement("div"),
img  = document.createElement("img");

img.src = source;
li.appendChild(img);
list.appendChild(li);
}

它是结束输出（我在php echo ="";中执行：

<ul id="index-slider-list">// this is present before loop;
<li><img src='source-here'></li> //it starts here
</ul>

假设我想在这个函数中添加两个div，第一个div有一个类并包围整个<li>，所以我追加li。第二个是div，它还有class，id和data-toggle，id实际上是php，它的语法可能会导致问题：

<ul id="index-slider-list">
<li>
<div class='thumbnail removable'> //here is new div
<div class='remove' id='{$row['id']}' data-toggle='remove'></div> //second div 
<img src='source-here'></li>"
</div> //ends
</ul>

这是我要去的地方（将这两行添加到function showUploadedItem）但它不起作用（显然），我还要研究如何发布id和数据切换：

div   = document.createElement("div").className += 'thumbnail removable',
remove   = document.createElement("div").className += 'remove';

li.appendChild(div);
div.appendChild(remove);

是因为我要两次追加李？什么是最好的方法来到这里？任何建议都将不胜感激。

Answer 1

首先将您的元素创建为变量，然后将id和classname添加到变量中，如下所示。

var myDiv = document.createElement("div");
myDiv.id = 'myDiv';
myDiv.className = 'thumbnail removeable';

var remove = document.createElement("div");
remove.id = 'remove';
remove.className = 'remove';

此外，可以在此处发布完整脚本，如果它真的很长，它将粘贴到iframe中，并且有助于更轻松地调试以查看其他内容。

CreateElement并附加两个div

1 个答案: