html创建客户端,创建HTML：PHP服务器端与jQuery客户端

小编典典

为什么要在PHP中生成HTML：

JavaScript应该定义行为，而不是内容。

用JavaScript创建需要更多标记(多行字符串不像PHP中那样容易)。

如果您的HTML是在多个位置(PHP和JS)生成的，则很难维护。

您可以使用jQuery的DOM操作函数来创建HTML，但从长远来看，您会陷入困境。

在服务器上创建HTML的速度比在浏览器上创建HTML的速度要快(在计算意义上)。

使用PHP循环更容易-生成表标记很容易。

如果在页面加载时输出标记，则用户禁用了JavaScript，则可以保留某种可操作性。

为什么要在jQuery中生成HTML：

您会节省一些带宽。

绑定事件可能更简单。

因此，我赞成第一种选择，即在PHP中生成HTML。

视觉比较这两种方法，创建一个简单的表。

选项1，使用PHP：

// PHP

$html = '

foreach($data as $row) {

$html .= '

';

$html .= '

Click!';

$html .= '

'.$row['id'].'';

$html .= '

'.$row['name'].'';

$html .= '

';

}

$html .= '

';

echo $html;

?>

// jQuery

$('#container').load('handler.php', function() {

$('#container a.button').click(function() {

// Do something

});

});

选项2，使用jQuery：

// PHP

echo json_encode($data);

// jQuery

$.ajax({

url: 'handler.php',

dataType: 'json',

success: function(data) {

var table = $('

');

var len = data.length;

for(var i = 0; i < len; i++) {

var row = $('

');

var a = $('').attr('href', '#').addClass('button');

row.append($('

').append(a));

row.append($('

').html(data[i].id);

row.append($('

').html(data[i].name);

table.append(row);

}

table.find('.button').click(function() {

// Do something

});

$('#container').html(table);

}

});

从设计/易于编码/美观的角度来看，我肯定会说采用PHP方法。

2020-07-26