Question

我想在每个ul元素中的两个列表项之间插入一个链接。目前我的代码只在最后一个ul元素中插入链接。

<html>
<div class="list">
   <ul>
      <li>what</li>
      <li>now</li>
   </ul>
</div>
<div class="list">
   <ul>
      <li>what</li>
      <li>now</li>
   </ul>
</div>

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<script>
  var tag = document.createElement("A")
  var linkedTag = tag.setAttribute('href', '/');
  tag.innerHTML = "UP"

  $('.list').each(function(i, obj) {
    var one = obj.childNodes[1];
    one.insertBefore(tag, one.childNodes[2])
  });
</script>
</html>

Answer 1

使用jQuery

可以更轻松地实现这一目标

$('.list').append(function() {
    return $('<a>', { href : '/', text : 'UP' })
});

您的代码无法正常工作的原因是因为您只创建了一个锚点并移动它，因此最终会将其移动到最后一个位置。

另请注意，直接在UL中插入锚点（这是您正在执行的操作）是无效标记。如果你想在每个UL之前放置一个锚，你就可以

$('.list ul').prepend(function() {
    return $('<a>', { href : '/', text : 'UP' })
});

如果你想在两个已经存在的LI元素之间使用锚点，那么你也必须将该锚点包装在LI元素中

$('.list ul li:first-child').after(function() {
    return $('<li>', {
        html : $('<a>', { href : '/', text : 'UP' })
    });
});

FIDDLE

在每个列表元素中插入链接标记

1 个答案: