JavaScript循环生成有序列表：如何将编号改为罗马数字？

有两种简单的实现方式，你可以根据需求选择：

方法1：直接给<ol>标签添加HTML属性 #

在生成<ol>标签时，加上type="I"属性即可显示大写罗马数字，若需要小写罗马数字则用type="i"。修改你的JavaScript代码如下：

const names = ["Name1", "Name2"];
let nLen = names.length;
// 给ol标签添加type属性指定罗马数字格式
let text = "<ol type='I'>";

for (let i = 0; i < nLen; i++) 
{
    text += "<li>" + names[i] + "</li>";
}
text += "</ol>";

document.getElementById("nLoop").innerHTML = text;

方法2：使用CSS样式控制 #

如果想通过样式统一管理列表格式，可采用以下两种方式：

方式A：内联样式 #

直接在生成<ol>时添加style属性：

let text = "<ol style='list-style-type: upper-roman;'>";

方式B：外部/内部CSS #

先在样式表中定义类：

.roman-number-list {
    list-style-type: upper-roman;
}

再在生成<ol>时绑定类名：

let text = "<ol class='roman-number-list'>";

内容的提问来源于stack exchange，提问作者Lazy Astronaut