Question

创建以下硬编码HTML或Javascript操作的更有效方法是：

预定义的网格，即行和列的常数，带有边框和样式以及事件处理程序。用HTML编写许多 div 是否更好。

<div class='tl' id='c00' style='top:0px; left:0px;'>A</div>
<div class='tl' id='c01' style='top:0px; left:20px;'>A</div>
<div class='tl r' id='c02' style='top:0px; left:40px;'>A</div>

或使用Javascript生成 div 。

d1 = "<div class='"
d2 = "' id='"
d3 = "' style='"
d4 = "'>"
d5 = "</div>"
sHTML = ""
for (j = 1; j < 5; ++j)
    for (i = 1; i < 5; ++i)
    {
        sClass = "t l ";

        if ((i+1 % 3) = 0)
            sClass = sClass + "r ";

        if ((j+1 % 3) = 0)
            sClass = sClass + "b ";

        sLine = d1 + sClass;
        sLine = sLine + d2 + "c" + n;
        sLine = sLine + d3 + "top:" + (i*20) + "px; left:" + (i*20) + "px;";
        sLine = sLine + d4 + "A";
        sLine = sLine + d5;
        document.writeln(sLine);
    }

创建HTML所需的时间不是问题，但由于它将在本地运行，并且可能在移动设备上运行，因此页面性能更重要。

感谢您的帮助。

Answer 1

硬编码会更快。浏览器需要以任何方式解析html。使用Javascript所做的一切都让它变得非常混乱并增加了开销。

Answer 2

如果您只是编写标记而不是使用JavaScript，维护也会变得非常容易。

如果要在JS中执行此操作...至少使用HTML DOM

进行操作

Answer 3

我建议使用重要的标记，而不是为每种必要使用div。在你的情况下，ul列表就足够了

表/网格布局 - 由Javascript生成的硬编码HTML

3 个答案: