A ver si esto te da una idea:
archivo de texto tpl.txt:
Código PHP:
<h1>{{TITULO}}</h1>
<p>{{CONTENIDO}}</p>
Achivo en el que usaríamos el template:
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<script type="text/javascript">
function http(){
if(typeof window.XMLHttpRequest!='undefined'){
return new XMLHttpRequest();
}else{
try{
return new ActiveXObject('Microsoft.XMLHTTP');
}catch(e){
alert('Su navegador no soporta AJAX');
return false;
}
}
}
function requestGETCallbackParam(url,callback,params){
var H=new http();
if(!H)return;
var p='';
for(var i in params){
p+='&'+i+'='+encodeURIComponent(params[i]);
}
H.open('get',url+'?'+p+'&'+Math.random(),true);
H.onreadystatechange=function(){
if(H.readyState==4){
callback(H.responseText);
H.onreadystatechange=function(){}
H.abort();
H=null;
}
}
H.send(null);
}
function cargarProducto(cambios){
requestGETCallbackParam('tpl.txt',function(r){
var t=r;
for(i in cambios){
t=t.split('{{'+i+'}}').join(cambios[i]);
}
document.getElementById('prod').innerHTML=t;
},{});
}
</script>
</head>
<body>
<div id="prod"></div>
<form>
<input onclick="cargarProducto({TITULO:'Este es un título',CONTENIDO:'Este es un contenido'})" type="button" value="prod1" /><input onclick="cargarProducto({TITULO:'Este es un título diferente',CONTENIDO:'Este es un contenido diferente'})" type="button" value="prod2" />
</form>
</body>
</html>
O mejor:
Código PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<script type="text/javascript">
function http(){
if(typeof window.XMLHttpRequest!='undefined'){
return new XMLHttpRequest();
}else{
try{
return new ActiveXObject('Microsoft.XMLHTTP');
}catch(e){
alert('Su navegador no soporta AJAX');
return false;
}
}
}
function requestGETCallbackParam(url,callback,params){
var H=new http();
if(!H)return;
var p='';
for(var i in params){
p+='&'+i+'='+encodeURIComponent(params[i]);
}
H.open('get',url+'?'+p+'&'+Math.random(),true);
H.onreadystatechange=function(){
if(H.readyState==4){
callback(H.responseText);
H.onreadystatechange=function(){}
H.abort();
H=null;
}
}
H.send(null);
}
function cargarProducto(cambios){
requestGETCallbackParam('tpl.txt',function(r){
var t=r.replace(/{{[^}]*}}/g, function(key){
return cambios[key.slice(2,-2)] || '';
});
document.getElementById('prod').innerHTML=t;
},{});
}
</script>
</head>
<body>
<div id="prod"></div>
<form>
<input onclick="cargarProducto({TITULO:'Este es un título',CONTENIDO:'Este es un contenido'})" type="button" value="prod1" /><input onclick="cargarProducto({TITULO:'Este es un título diferente'})" type="button" value="prod2" />
</form>
</body>
</html>