Javascript 嵌套数组/对象创建html？ var bbcode= [{ 内容：{ newBB:[“b”、“u”、“i”、“列表”]， newBB:[“j”、“k”、“l”、“m”]， NEBB:[“关闭”、“停止”、“返回”、“时间”]， }, }]; 对于（var j=0；j

该对象无法正常工作。不能使用同一个键3次。这应该是一个简单的2D数组

var bbcodes = 
[{
   contents: {
     new:["b","u","i","list"],
     new:["j","k","l","m"],
     new:["close","stop","back","time"],
   },
}];

$（'body'）。追加（temp+“”）；

因为jQuery似乎是可用的，所以有更简单的方法来实现这一点

让我们试试这个

$('body').append(temp+'</span>');

var bbcode=[
[“b”、“u”、“i”、“列表”]，
[“j”、“k”、“l”、“m”]，
[“关闭”、“停止”、“返回”、“时间”]
];
变量i、j、内跨、外跨、currentVal、classStr；
对于（j=0；j如果，正如我认为您所建议的那样，
bbcodes
的格式没有限制，只要它生成您发布的正确标记。那么我将按照如下方式重新构造它，并使用普通的旧javascript生成标记，如下所示

Javascript

    var bbcodes = [
    ["b","u","i","list"],
    ["j","k","l","m"],
    ["close","stop","back","time"]
];
var i,j,innerspan,outerspan,currentVal,classStr;
for(j=0;j<bbcodes.length;j++){

    outerSpan = $("<span>").addClass("button_wrap");

    for (i=0;i<bbcodes[j].length;i++){

        currentVal = bbcodes[j][i];
        classStr = "easy_edit_button easy_button_"+currentVal;
        innerspan = $("<span>").addClass(classStr).html(currentVal);
        outerSpan.append(innerspan); //add the inner span to the container span
     }
     $("body").append(outerSpan) // add each container span to the body.
}

var bbcodes = [
    ["b", "u", "i", "list"],
    ["j", "k", "l", "m"],
    ["close", "stop", "back", "time"]
];


bbcodes.forEach(function (group) {
    var wrap = document.createElement("span");

    wrap.className = "button_wrap";

    group.forEach(function (item) {
        var button = document.createElement("span");

        button.className = "easy_edit_button easy_button_" + item;
        button.textContent = item;

        wrap.appendChild(button);
    });

    document.body.appendChild(wrap);
});

在

为什么？如果数据是固定的，那么您就不需要所有额外的对象，因为您已经多次使用同一个“键”，而它需要是唯一的

这是使用，可以很容易地使用，也可以更改为
while
或
for
循环

更新：如果您不喜欢填充，则以下是上面的内容，但在循环时转换为
，这是跨浏览器友好的，无需填充。并使用代替

Javascript

    var bbcodes = [
    ["b","u","i","list"],
    ["j","k","l","m"],
    ["close","stop","back","time"]
];
var i,j,innerspan,outerspan,currentVal,classStr;
for(j=0;j<bbcodes.length;j++){

    outerSpan = $("<span>").addClass("button_wrap");

    for (i=0;i<bbcodes[j].length;i++){

        currentVal = bbcodes[j][i];
        classStr = "easy_edit_button easy_button_"+currentVal;
        innerspan = $("<span>").addClass(classStr).html(currentVal);
        outerSpan.append(innerspan); //add the inner span to the container span
     }
     $("body").append(outerSpan) // add each container span to the body.
}

var bbcodes = [
    ["b", "u", "i", "list"],
    ["j", "k", "l", "m"],
    ["close", "stop", "back", "time"]
];


bbcodes.forEach(function (group) {
    var wrap = document.createElement("span");

    wrap.className = "button_wrap";

    group.forEach(function (item) {
        var button = document.createElement("span");

        button.className = "easy_edit_button easy_button_" + item;
        button.textContent = item;

        wrap.appendChild(button);
    });

    document.body.appendChild(wrap);
});

var bbcode=[
[“b”、“u”、“i”、“列表”]，
[“j”、“k”、“l”、“m”]，
[“关闭”、“停止”、“返回”、“时间”]
],
bbcode长度=bbcode.length，
bbcodesIndex=0，
分组长度，
组索引，
集团,，
项目,，
包
按钮
文本；
while（bbcodesIndex

在
上，数组连接方法是解决此类问题的好方法。如果不是因为需要调整每个类，我甚至不需要内部循环。它对于在不需要添加唯一属性的情况下创建表和列表特别强大和简洁

var bbcodes = [
        ["b", "u", "i", "list"],
        ["j", "k", "l", "m"],
        ["close", "stop", "back", "time"]
    ],
    bbcodesLength = bbcodes.length,
    bbcodesIndex = 0,
    groupLength,
    groupIndex,
    group,
    item,
    wrap,
    button,
    text;

while (bbcodesIndex < bbcodesLength) {
    group = bbcodes[bbcodesIndex];
    wrap = document.createElement("span");
    wrap.className = "button_wrap";
    groupLength = group.length;
    groupIndex = 0;
    while (groupIndex < groupLength) {
        item = group[groupIndex];
        text = document.createTextNode(item);
        button = document.createElement("span");
        button.className = "easy_edit_button easy_button_" + item;
        button.appendChild(text);
        wrap.appendChild(button);
        groupIndex += 1;
    }

    document.body.appendChild(wrap);
    bbcodesIndex += 1;
}

var bbcode=
[
[“b”、“u”、“i”、“列表”]，
[“j”、“k”、“l”、“m”]，
[“关闭”、“停止”、“返回”、“时间”]
],
l=bbcode.length，
joinRight=''+此行[ll]；
}
bbcodes[l]=joinRight+thisRow.join（joinLeft+joinRight）+joinLeft；
}
bbcodes=outerJoinRight+bbcodes.join（joinLeft+outerJoinRight）+joinLeft；
document.body.innerHTML=bbcode；
你不能像那样使用
new
，因为它是一个保留字。请用引号括起来。其次，你也不能一遍遍地重复使用对象键。我立即注意到两件事。那么，我如何继续像new一样获取相同的数据，以使其正确设置。对不起，这里只是一个新手：D@JonathanSampson当前位置没有rese对属性名进行了限制，尽管一些旧浏览器会阻塞它。@CrazyTrain尝试使用
new
作为属性索引将导致一条意外的
：
消息。这是一个保留字。@CrazyTrain很好，你说得对。我现在明白它们需要修复。我只是想让这件事尽可能简单o用户添加他们想要的bbcodes。我知道纯js是最好的，但问题是它不支持跨浏览器。我开始学习Vanilla，并完全用JavaScript编写了这段很棒的代码，结果发现IE7、IE8和FF不太喜欢：）使用querySelectorAll、byId和其他一些工具，我不认为还有很多人还在关注IE7。IE8有querySelectorAll。是的，我有一些打字错误。我更新并链接了一个正在工作的JSFIDLE。或者你可以用触发事件的getter/setter方法创建对象。
var bbcodes = 
[
    ["b","u","i","list"],
    ["j","k","l","m"],
    ["close","stop","back","time"]
],
l = bbcodes.length,
joinRight = '<span class="easy_edit_button easy_button_',
joinLeft = '</span>',
outerJoinRight = '<span class="button_wrap">';

while(l--){
    var thisRow = bbcodes[l],
    ll = thisRow.length;

    while(ll--){
        thisRow[ll] += '">' + thisRow[ll];
    }

    bbcodes[l] = joinRight + thisRow.join(joinLeft+joinRight) + joinLeft;
}
bbcodes = outerJoinRight + bbcodes.join(joinLeft + outerJoinRight) + joinLeft;

document.body.innerHTML = bbcodes;