获取有序列表项的计算数量

Question

有没有办法获取有序列表项的数字的内容？

 var list = document.getElementById('list'); list.style.listStyleType = 'upper-roman'; 

 <ol class="list" id="list"> <li class="list__item">apple</li> <li class="list__item">banana</li> <li class="list__item" id="target">orange</li> <li class="list__item">pear</li> </ol> 

这将产生这样的项目列表。

I. apple
II. banana
III. orange
IV. pear

有没有办法获得#target列表项的III字符串？

编辑：

这里的罗马字符只是一个例子。 我希望能够访问任何list-style-type选项提供的内容。

Answer 1

我能想到这样做的唯一方法如下：

1）获取项目的索引（例如3）

2）有这样的功能： https ： //stackoverflow.com/a/9083076/1324321

3）通过该函数运行索引

Answer 2

我在这里创建了一个jsfiddle ，它可以向用户显示所选的选择。 虽然javascript没有将其保存为字符串，但我首先找到所选列表项的索引，然后重新创建该项的列表，并将“start”属性设置为该索引。

这是HTML：

<ol>

  <li>first</li>
  <li>second</li>
  <li id="active">third</li>
  <li>Fourth</li>
</ol>

<br/>
<br/>
<div id='selected'>
</div>

和JQuery：

$(document).ready(function() {
  var intt = $('li').index($('#active')) + 1;
  $('#selected').html('<ol start="' + intt + '"><li></li></ol>');
});

的jsfiddle

Answer 3

您可以使用start属性并迭代所有列表元素。

 var list = document.getElementById('list'), start = list.start || 0; list.style.listStyleType = 'upper-roman'; Array.prototype.forEach.call(list.getElementsByTagName('li'), function (a, i) { if (a.id === 'target') { console.log(i + start); console.log(a.innerHTML); } }); 

 <ol class="list" id="list" start="5"> <li class="list__item">apple</li> <li class="list__item" >banana</li> <li class="list__item" id="target">orange</li> <li class="list__item">pear</li> </ol>