Установка атрибутов с помощью javascript

Question

Имею:

const items = document.querySelectorAll('#players li');
console.log(items[0], items[1], items[2]);

<section id="players">
  <h1>Players</h1>
  <ol>
    <li>Alice</li>
    <li>Bob</li>
    <li>Cesar</li>
  </ol>
</section>

Производство:

Players
    1.Alice
    2.Bob
    3.Cesar

Теперь я хочу преобразовать целые числа в римские цифры, используя javascript, извне в моем javascript файла, вместо для установки цифр в HTML -файле, например:

<ol type="i">
  <li>First</li>
  <li>Second</li>
  <li>Third</li>
</ol> 

Это мой код Javascript, но я хочу преобразовать числа в числа:

const items = document.querySelectorAll('#players li');
console.log(items[0], items[1], items[2]);

Answer 1

Просто настройте свой список с помощью атрибута type;

document.querySelector("ol").type = "I";
const items = document.querySelectorAll('#players li');
console.log(items[0], items[1], items[2]);

<section id="players">
  <h1>Players</h1>
  <ol>
    <li>Alice</li>
    <li>Bob</li>
    <li>Cesar</li>
  </ol>
</section>

Answer 2

вы можете изменить атрибут типа тега ol ссылка

const items = document.querySelectorAll('#players li');
document.querySelector("ol").type = "i";
console.log(items[0], items[1], items[2]);

<section id="players">
  <h1>Players</h1>
  <ol>
    <li>Alice</li>
    <li>Bob</li>
    <li>Cesar</li>
  </ol>
</section>

Answer 3

Вы можете просто querySelect родительского 'ol', а затем изменить его стиль списка в Javascript, используя element.style.listStyleType = "upper-roman". Это должно применить стиль к его дочерним элементам.