javascript - 将逗号分隔的列表转换为无序列表

Question

寻找任何 PHP、Jquery、javascript 解决方案来获取以逗号分隔的数据并将其转换为无序列表。

为了进一步解释，我已将 CSV 文件导入 wordpress，一个元素块包含大量以逗号分隔的数据，我需要将其显示为列表。

感谢所有帮助！

Answer 1

在 PHP 中

$list = 'item1,item2,item3,item4';
$list = explode(',', $list);
shuffle($list);
$html = '<ul>';
foreach($list as $item) {
    $html .= '<li>' . $item . '</li>';
}
$html .= '</ul>';

print $html;

在 JavaScript 中

var list = 'item1,item2,item3,item4';
list = list.split(',');
list.sort(function() { return 0.5 - Math.random() });
var html = '<ul>';

 for(var i=0; i<list.length; i++) {
    html += '<li>' + list[i] + '</li>';
  }

html += '</ul>';

Answer 2

有更简洁的方法来编写它，但希望这能让您了解如何使用 jQuery 来完成它。

$(function(){
  $csv = $("#csv")
  items = $csv.text().split(",")
  $csv.replaceWith($("<ul/>"))
  items.forEach(function(item){
      $("ul").append("<li>"+item+"</li>")
  })
})

这是小提琴：http: //jsfiddle.net/JmwDw/

Answer 3

HTML

<ul id="ul-test">
</ul>

JavaScript

var CSV = "a,b,c,d,e";
var arrCSV = CSV.split(','),
    ul = document.getElementById("ul-test");

for (var i = 0, len = arrCSV.length; i < len; i++) {
    var li = document.createElement("li");
    var text = document.createTextNode(arrCSV[i]);
    li.appendChild(text);
    ul.appendChild(li);
}

JSFiddle