0

我在一个基本上是十六进制查看器的 webapp 中使用 jquery。我将每个字节放在它自己的元素（只是一个 <i> 标记）中，并带有一个唯一的 id（文件中的偏移量），所以我可以轻松地引用它。我基本上结束了：

var str = 
  "<i id=h0>00 </i>" +
  "<i id=h1>00 </i>" + 
  "<i id=h3>00 </i>" +
  "...";
$("#myid").html(str);

设置该 html 行大约需要 3 秒，当该 str 具有 100K 个标签时（我构建 str var 的方式不同，所以不要对此发表评论，为了清楚起见，我只是在这里这样写，这不是问题）。

是否可以在保持引用显示的每个字节的简单方法的同时提高其性能？我想将每个字节保留在标签中，以便我可以轻松设置它的背景颜色等。我能想到的唯一选择就是一次加载文件的一部分（在那个 str 变量中只保留 10,000 个标签）。

4

6 回答 6

1

干脆不要。

没有人需要同时查看 100k 字节，即使有人拥有足够大的屏幕来实际查看它们。

只需渲染您现在实际需要显示的标签，并在需要时渲染更多。

于 2012-07-20T22:48:43.123 回答
0

您可以通过多次执行此操作来逐步加载它：

var str = "<i id=h0>00 </i>";
$("#myid").append(str);
于 2012-07-20T22:33:54.527 回答
0

您可以消除标签并编写一个函数，该函数使用 string,slice(a,b) 返回您想要的字符串的文本部分。这将减少加载时间和整体字符数。

于 2012-07-20T22:35:00.270 回答
0

您可以消除<i>标签并仅在实际需要时（以控制背景颜色）在特定文本上以编程方式添加它们。然后，您将按需添加它们，而不是预先占用太多开销。

浏览器应该更有效地使用更少的标签来吞食大量文本。

另一种可能性是实现分页或选项卡，以便不会一次显示所有数据（谁可能想一次查看 100,000 个项目），然后根据需要动态构建后续选项卡/页面。您将一次构建较小的分页项目。这也将消耗更少的内存，因此对移动设备更加友好。

于 2012-07-20T22:41:40.320 回答
0

查看文档片段。我怀疑 jQuery 的 html 方法使用它。我的猜测是 .html() 只是改变了 innerHTML 属性。documentFragments 可能会提高您的速度，请阅读这篇文章，http ://ejohn.org/blog/dom-documentfragments/

于 2012-07-20T22:43:36.133 回答
0

你应该

$('<i />').attr('id', 'TAB0').html('hello world');

尝试

var $mytab = $('mytab');
$([ 
    { id: 'myid0', iHtml: 'hello world' },
    { id: 'myid1', iHtml: 'hello world' }
]).each(function (n) {
  var data = this;

  $mytab.append(
    $('<i />').attr('id', data.id).html(data.iHtml)
  );

});
于 2012-07-20T23:13:48.877 回答