javascript – 抓住第一个第十个Ajax返回列表

我有一个巨大的html文件aprox 200MB(mycartoonlist.html),我应该通过AJAX获取并将其附加到特定的ID中.这是我的ajax：

    $(document).ready(function() {           
       $.ajax({
            url: "mycartoonlist.html",
            type: "GET",
            dataType: "html",
            success: function(data, textStatus, jqXHR)
            {
                $("#cartoonlisting").html(data);

                console.log(data);
                console.log(jqXHR);
            },
            error: function (jqXHR, textStatus, errorThrown)
            {
                alert(textStatus)
            }
        });

 });

上面的Ajax生成了数千个列表,如下所示：

<div id="1" class="list">Cartoon abc</div>
<div id="2" class="list">Cartoon mnk</div>
<div id="3" class="list">Cartoon klo</div>
......................
<div id="10000988" class="list">Carton zzz</div>

这将被注入：

<div id="cartoonlisting"></div>

我知道我不能将所有这些列表注入到我的#cartoonlisting中,这将导致我的浏览器崩溃,因此我只想将第一个十分注入#cartoonlisting

任何建议或意见将不胜感激.

Oouch和我无法通过服务器端脚本将mycartoonlist.html拆分成碎片

我的解决方案

我使用.load()Ajax方法,而不是使用基本的.ajax,如下所示：

$(document).ready(function(){
   $("#cartoonlisting").load("mycartoonlist.html #1,#2,#4,#5,#6,#7,#8,#9,#10")
});

以上简短的代码只是我如何注入html并从数千个中选择一些元素的想法.在我的情况下

解决方法:

you can collect all the @R_485_4045@ion coming from mycartoonlist.html in
a json object , and then iterate the json object using foreach loop
and display only the tenth index data to the div id
“cartoonlisting“