Question

我正在使用jQuery来获取锚标记及其内容，但是我使用的方法还抓取了锚标记旁边的span标记。我只想获取锚标签。我该怎么办？

myinput = "5 + 2j"
mycleaninput = myinput.replace(" ","")
myoutput = complex(mycleaninput) * (3 + 12j)
print(myoutput)

$('.chosen').each(function(){
  var cur = $(this).html();
  encodeURIComponent(cur);
  $('#custom_crumb').append(cur);
});

Answer 1

如果要使用锚的内部 HTML，则：

var cur = $(this).find("a").html();

如果您想要它的外部 HTML，则：

var cur = $(this).find("a").prop("outerHTML");

outerHTML版本的实时示例，因为我认为这就是您想要的：

$('.chosen').each(function(){
  var cur = $(this).find("a").prop("outerHTML");
  $('#custom_crumb').append(cur);
});

<ul>
  <li class="chosen" style="display: none;">
    <a rel="nofollow" href="http://website.co.uk/shop/?filter_colour=amber">Amber</a>

    <span class="count">(14)</span>
  </li>
</ul>

<div id="custom_crumb"></div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

请注意，我删除了encodeURIComponent(cur);行，因为您没有使用返回值，所以它没有任何作用。如果出于某种原因（似乎很奇怪）想要添加它，请添加回去，但要使用cur = encodeURIComponent(cur);。

Answer 2

您需要先找到a标签。

$('.chosen').each(function(){
  var cur = $(this).find('a').html();
  encodeURIComponent(cur);
  $('#custom_crumb').append(cur);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li class="chosen" style="display: none;">
  <a rel="nofollow" href="http://website.co.uk/shop/?filter_colour=amber">Amber</a>
  
  <span class="count">(14)</span>
</li>
</ul>

<div id="custom_crumb"></div>

Answer 3

您可以直接在选择器中选择a元素：

$('.chosen a').each(function(){
  var cur = $(this).html();
  $('#custom_crumb').append(cur);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="chosen" style="display: none;">
  <a rel="nofollow" href="http://website.co.uk/shop/?filter_colour=amber">Amber</a>
  
  <span class="count">(14)</span>
</li>

<div id="custom_crumb"></div>

Answer 4

使用.first（）。

$('.chosen > a').first()

注意：它将使用.html（）返回元素本身以获取内容（HTML）。即使您在.chosen中具有多个锚点，它也将起作用。它将选择第一个锚标记。

Answer 5

您可以使用$('.chosen a')，它将在类chosen内选择锚标记

$('.chosen a').each(function(){
  var cur = $(this).html();
  encodeURIComponent(cur);
  $('#custom_crumb').append(cur);
});

Answer 6

您需要在

中指定元素

$（this）.html（）

在此li中，它具有两个元素范围和a。对于特定元素，您需要告诉jquery我只需要一个元素。

$（this）.find（'a'）。html（）

$('.chosen').each(function() {
  var cur = $(this).find('a').eq(0).html();
  $('#custom_crumb').append(cur);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<li class="chosen" style="display: none;">
  <a rel="nofollow" href="http://website.co.uk/shop/?filter_colour=amber">Amber</a>

  <span class="count">(14)</span>
</li>

<div id="custom_crumb"></div>

Answer 7

所有答案都忽略了一个事实，即.html()显然是您要执行的操作的错误函数。

您可以选择锚标记并将其附加到某个位置，也可以对其进行克隆。两种方法都比读取和重新解析html的性能高得多。

var crumb = $('#custom_crumb');

$('.chosen').each(function(){
  var anchor = $(this).find('a').first();

  crumb.append(anchor);

  // or, to keep the a in the <li>

  crumb.append(anchor.clone());
});

Answer 8

尝试$(".chosen > a")，如果要获取内容，请尝试使用Jquery方法

使用.html（）获得单个元素

8 个答案: