通过 jQuery 删除 10 个最新元素

发布于 2024-12-09 10:28:53 字数 2127 浏览 0 评论 0原文

我正在尝试编写类似 facebook 最近更新部分的内容,因此我通过 jQuery 和 JavaScript 编写以下代码,

<script type="text/javascript">
var time ='<?php echo (time()); ?>';
time = 0;// remove later
var counter = 0;
var profile_url = '<?php echo (base_url()); ?>index.php/profile/';
var base_get_update_url = '<?php echo (base_url()); ?>index.php/pro_ajax/last_update/';
function get_update()
{
    var get_update_url = base_get_update_url + time;
    $.getJSON(get_update_url,function(data){
      var count_result = data[0].length + data[1].length + data[2].length + data[3].length;

       var update =  $("#UpDate").children();
        if ((update.length != 0) && (update.length + count_result) >= 15)
       {

           for (var i = 0;i < (update.length + count_result) && i < update.length;i++)
               {
                   update =  $("#UpDate").children();
                   update.last().remove();
               }
       }

      for (var i = 0;i < data[0].length;i++)
          {
              $("#UpDate").prepend('<li><a href="'+profile_url+data[0][i][1]+'">'+data[0][i][0]+'<hr /></a></li>');
          }

      for (var i = 0;i < data[1].length;i++)
          {
              $("#UpDate").prepend('<li><a href="'+profile_url+data[1][i][1]+'">'+data[1][i][0]+'<hr /></a></li>');
          }
      for (var i = 0;i < data[2].length;i++)
          {
              $("#UpDate").prepend('<li><a href="'+profile_url+data[2][i][1]+'">'+data[2][i][0]+'<hr /></li>');
          }
      for (var i = 0;i < data[3].length;i++)
          {
              $("#UpDate").prepend('<li><a href="'+profile_url+data[3][i][1]+'">'+data[3][i][0]+'<hr /></a></li>');
          }

    });
}
setInterval("get_update()", 5000);

它将获得最后更新并成功显示它们,但它无法删除子项。 我尝试这样做,如果新元素+之前元素超过15,它应该删除第一个元素的一些。但它不能这样做。为什么? (以下代码将显示 UpDate 部分):

<td style="width: 200px;text-align: left;border: 2px solid white" id="UpDate"></td>

I'm trying to program something like facebook recent update part,so I program following code by jQuery and JavaScript

<script type="text/javascript">
var time ='<?php echo (time()); ?>';
time = 0;// remove later
var counter = 0;
var profile_url = '<?php echo (base_url()); ?>index.php/profile/';
var base_get_update_url = '<?php echo (base_url()); ?>index.php/pro_ajax/last_update/';
function get_update()
{
    var get_update_url = base_get_update_url + time;
    $.getJSON(get_update_url,function(data){
      var count_result = data[0].length + data[1].length + data[2].length + data[3].length;

       var update =  $("#UpDate").children();
        if ((update.length != 0) && (update.length + count_result) >= 15)
       {

           for (var i = 0;i < (update.length + count_result) && i < update.length;i++)
               {
                   update =  $("#UpDate").children();
                   update.last().remove();
               }
       }

      for (var i = 0;i < data[0].length;i++)
          {
              $("#UpDate").prepend('<li><a href="'+profile_url+data[0][i][1]+'">'+data[0][i][0]+'<hr /></a></li>');
          }

      for (var i = 0;i < data[1].length;i++)
          {
              $("#UpDate").prepend('<li><a href="'+profile_url+data[1][i][1]+'">'+data[1][i][0]+'<hr /></a></li>');
          }
      for (var i = 0;i < data[2].length;i++)
          {
              $("#UpDate").prepend('<li><a href="'+profile_url+data[2][i][1]+'">'+data[2][i][0]+'<hr /></li>');
          }
      for (var i = 0;i < data[3].length;i++)
          {
              $("#UpDate").prepend('<li><a href="'+profile_url+data[3][i][1]+'">'+data[3][i][0]+'<hr /></a></li>');
          }

    });
}
setInterval("get_update()", 5000);

it will get last update and show them successfully,but It can't remove child.
I try to do if new element + before element is more than 15,it should remove some of first element.but it can't do it.why?
(following code will show UpDate part) :

<td style="width: 200px;text-align: left;border: 2px solid white" id="UpDate"></td>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

极度宠爱 2024-12-16 10:28:53

删除元素可以以更简单的方式实现。考虑使用 .slice() 方法,它允许您选择一个所选元素的子集,因此您可以通过以下调用删除 #UpDate 元素的一些子元素:(

$('#UpDate').children().slice(0, n).remove();

n 是要删除的子元素数量)

作为旁注,您似乎要添加

  • 元素转换为 元素,该元素不是有效的 HTML。
  • Removing elements can be implemented in a much simpler way. Consider using the .slice() method, which allows you to select a subset of the selected elements, so you could remove some children of the #UpDate element with the following call:

    $('#UpDate').children().slice(0, n).remove();
    

    (n is the number of child elements that you want to remove)

    As a side note, you seem to be adding <li> elements to a <td> element, which is not valid HTML.

    ~没有更多了~
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文