使用每个测验Jquery迭代

时间:2017-04-24 02:23:04

标签: javascript jquery loops append each



$('p').each(function (index) {
  var letters = $(this).text().length;
 $('p').appendTo('<span> Here is ' + letters + '</span>');
});

  
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Lorem</p>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. A amet vel fugit repellendus, magni blanditiis delectus autem dicta, omnis odit beatae iusto asperiores, iste. Delectus, eaque reiciendis quibusdam cupiditate molestias officia perspiciatis corporis cumque saepe voluptatem, magnam magni asperiores a!</p>
&#13;
&#13;
&#13;

您好,我将非常感谢我的代码,我需要计算每个<p>代码的所有字母,并将其显示在<p>代码的末尾,但我的代码全部计算在内我在页面上有<p>个标签并将它们放在每个标签中,任何机构都可以告诉我这是什么。错了以及如何解决它,非常感谢你

2 个答案:

答案 0 :(得分:1)

因为$('p')会在页面中找到每个<p>,就像使用它来设置初始查询一样

您希望each中的特定实例是$(this),而您希望append()不是appendTo()

$('p').each(function (index) {
  var letters = $(this).text().length;
  $(this).append('<span style="color:red"> Here is ' + letters + '</span>');
});

  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Lorem</p>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. A amet vel fugit repellendus, magni blanditiis delectus autem dicta, omnis odit beatae iusto asperiores, iste. Delectus, eaque reiciendis quibusdam cupiditate molestias officia perspiciatis corporis cumque saepe voluptatem, magnam magni asperiores a!</p>

答案 1 :(得分:0)

$('p').each(function (index) {
  $('<span></span>',{text :  " Here is " + $(this).text().length + ""}).css({color:'blue'}).appendTo(this);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>Lorem</p>

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. A amet vel fugit repellendus, magni blanditiis delectus autem dicta, omnis odit beatae iusto asperiores, iste. Delectus, eaque reiciendis quibusdam cupiditate molestias officia perspiciatis corporis cumque saepe voluptatem, magnam magni asperiores a!</p>