如何添加一个类名与无序列表ID相同的列表项？

我正在生成具有不同状态名称的项目列表作为类名称。这些列表项需要使用相同的类名称作为id附加到无序列表中。所以，目前的DOM的样子：如何添加一个类名与无序列表ID相同的列表项？

<ul id="Montana"></ul> 
<ul id="Nebraska"></ul> 
<ul id="Oregon"></ul> 
<li class="Montana>Hello World</li> 
<li class="Montana>Hello World</li> 
<li class="Oregon>Hello World</li> 
<li class="Nebraska>Hello World</li> 
<li class="Montana>Hello World</li> 
<li class="Montana>Hello World</li> 
<li class="Oregon>Hello World</li> 
<li class="Montana>Hello World</li>

一般情况下我只是通过追加像循环：

for(var i =0; i < something.length; i++){ $('#' + something[i]).append('.' + something[i]);

但是，目前没有工作。老实说，我可能只是做一个小型中风，需要一巴掌。

有什么建议吗？打在脸上？

编辑：

我返回了一个JSON blob。它的一个关键/值对是“状态”：无论状态如何。我通过blob运行for循环，并用这些class/id名称创建一堆ul和li。我会展示我的所有代码，但是我还添加了一堆SVG相关的东西，这些东西只会让问题膨胀。

来源

2016-04-26 Alex Marple

可以使用更多的代码上下文... – IMTheNachoMan

什么是你的代码中的东西？ – IMTheNachoMan

这项工作？获取所有li s，遍历它们，找到匹配每个li s类的ID并追加li。

var lis = document.getElementsByTagName("li"); 
for(var i = 0, numLis = lis.length; i < numLis; ++i) 
{ 
    document.getElementById(lis[i].className).appendChild(lis[i]); 
}

来源

2016-04-26 16:44:46 IMTheNachoMan

使用jQuery：

$('li').each(function(index, li){ 
    li = $(li); 
    li.appendTo($('ul#' + li.attr('class'))); 
});

来源

2016-04-26 16:52:43

虽然我不知道你为什么要添加国家名称作为类/ IDS，我不建议加这种东西（一般页面数据）到属性中的html（除非将它添加到'data'属性中）。一般来说，类和id是用于样式和功能的，数据应该在一个单独的元素中（如果它应该是隐藏的）。

您可以改为创建元素层次结构。事情是这样的：

<li class="state-li"> 
    <div class="text"> 
    Hello World 
    </div> 
    <div class="state-name hidden"> 
    Montana 
    </div> 
</li>

，那么你可以使用jQuery很容易地找到state-li类

的孩子

但回答你的问题（jQuery的）：

elementToAppendTo = $('#elementId'); 
stateList = [list of states]; 
var length = stateList.length; 

for(var i = 0; i < length; i++) { 
    $(elementToAppendTo).append("<li id='" + stateList[i] + "'></li>"); 
}

来源

2016-04-26 16:54:20

谢谢大家！我结束了一个：

$('.' + something[i].stateName).appendTo('#' + something[i].stateName);

成为伎俩。有了这个说法，我很确定你们所提供的建议也可以发挥作用。

来源

2016-04-26 17:39:48

如何添加一个类名与无序列表ID相同的列表项？

回答

相关问题