Question

有没有办法在html中使用自引用“列表项”，因此当我在有序列表中引用数字或字母时，它会跟踪更改。因此，当我添加或删除列表项时，它会自动将引用更改为更新为新的有序列表编号或字母。

如果在旧的html版本中无法使用这种类型的自引用，那么在html5中怎么样？

这种类型的引用也可以在javascript或者像jQuery这样的javascript框架中使用吗？

Answer 1

也许这会有所帮助：Ordered List Index

Answer 2

给出像

这样的HTML

<ol title="Figure 1">
  <li id="poundcake">Pound Cake</li>
  <li id="spongecake">Sponge Cake</li>
</ol>

<p>The most delicious from the list above is <label for="spongecake">.</p>

然后在底部（或onload），

<script>(function () {

  // From http://stackoverflow.com/questions/5395177/ordered-list-index
  function itemIndex(listItem) {
    var index = 0;
    for (var sibling = listItem; sibling;
         sibling = sibling.previousSibling) {
      if (sibling.tagName == "LI") {
        var value = +sibling.value;
        if (value) {
          return value + index;
        }
        ++index;
      }
    }
    var start = +listItem.parentNode.start || 1;
    return start + index - 1;
  }

  var labels = document.getElementsByTagName("label");
  for (var i = 0, n = labels.length; i < n; ++i) {
    var label = labels[i];
    var id = label.getAttribute("for");
    if (!id) { continue; }
    var target = document.getElementById(id);
    if (!target || target.tagName !== "LI") { continue; }
    var replacementText = (target.parentNode.title || "")
        + " item " + itemIndex(target);
    label.parentNode.replaceChild(
        document.createTextNode(replacementText), label);
  }

}())</script>

自引用html中的列表项以获取有序列表

2 个答案: