php 页面和代码分离,javascript-PHP如何和HTML代码分离？

Categories

";

if(mysqli_num_rows($run_query)>0){

while($row = mysqli_fetch_array($run_query)){

$cid = $row["cat_id"];

$cat_name = $row["cat_title"];

echo "

$cat_name

";

}

echo "";

}

}

?>

//JS

$(document).ready(function() {

cat();

function cat() {

$.ajax({

url: 'action.php',

type: 'POST',

data: {

category: 1

}

})

.done(function(data) {

//console.log(data);

$("#get_category").html(data);

});

}

})

php是小白，有没有办法前后端分离，把echo的HTML代码返回json的格式给前端处理？

回复内容：

Categories

";

if(mysqli_num_rows($run_query)>0){

while($row = mysqli_fetch_array($run_query)){

$cid = $row["cat_id"];

$cat_name = $row["cat_title"];

echo "

$cat_name

";

}

echo "";

}

}

?>

//JS

$(document).ready(function() {

cat();

function cat() {

$.ajax({

url: 'action.php',

type: 'POST',

data: {

category: 1

}

})

.done(function(data) {

//console.log(data);

$("#get_category").html(data);

});

}

})

php是小白，有没有办法前后端分离，把echo的HTML代码返回json的格式给前端处理？

寥寥几行代码就可以分离界面和逻辑,实现MVC:

/index.php (页面控制器)

if(!defined('ROOT')) define('ROOT', __DIR__);

require ROOT.'/include/common.php';

echo render('index.php'); //输出HTML

echo json_encode(array('Server'=>'PHP')); //输出JSON

/include/common.php (公共操作)

if(!defined('ROOT')) exit();

require ROOT.'/include/funclass.php';

/include/funclass.php (函数和类)

if(!defined('ROOT')) exit();

function render($view) {

ob_end_clean(); ob_start();

require ROOT.'/view/'.$view;

$html = ob_get_contents();

ob_end_clean(); ob_start();

return $html;

}

/view/index.php (视图)

require __DIR__.'/header.php'; //if(!defined('ROOT')) exit();

require __DIR__.'/footer.php'; //JS代码一般写在footer.php里前面

PHP中

echo json_encode($html);

前端

success: function(data) {

$("#get_category").html(data);

}

php作这样处理，单独放到一个文件，js向这个文件请求就可以了

Categories";

if(mysqli_num_rows($run_query)>0){

while($row = mysqli_fetch_array($run_query)){

$cid = $row["cat_id"];

$cat_name = $row["cat_title"];

$html.="

$cat_name";

}

$html.="";

echo $html;

}

}

?>

数据库里的查出来转成数组，json_encode下输出，js调用，取到数据，js遍历下数组(拼接html的ajax的done里)，拼接下html，这样php和html就完全分开了

我觉得可以先确定前端页面想要展示哪些内容。假设这些内容有了啊，基于这些内容写好页面，剩下的就是这些内容对应的数据。

而php就像楼上所说的，提供一个api接口，比如返回json数据，里面的数据就可以通过ajax来向服务器请求。拿到数据后用js填充数据到页面里面去就好了。

我觉得你可能在想一个问题。就是输出列表问题对吧。这个可以简单做

ajax给前端后，前端拿到json对象，可以用前端模板引擎来做。推荐你用juicer

Javascript 代码:

var data = {

list: [

{name:' guokai', show: true},

{name:' benben', show: false},

{name:' dierbaby', show: true}

],

blah: [

{num: 1},

{num: 2},

{num: 3, inner:[

{'time': '15:00'},

{'time': '16:00'},

{'time': '17:00'},

{'time': '18:00'}

]},

{num: 4}

]

};

var tpl = document.getElementById('tpl').innerHTML;

var html = juicer(tpl, data);

后端：

要想返回 json 格式： 你得把你想要返回的 html 弄到一个数组里面 ，例如：

$json = array(

'html' => $html

);

echo $json;

前端接受：

$.ajax(

success: function(json){

$("#get_category").html(json['html']);

}

);

本条技术文章来源于互联网，如果无意侵犯您的权益请点击此处反馈版权投诉

本文系统来源：php中文网