[英]HTML template - fill specific data
Hi guys I need to make a template html file and change specific data in it. 嗨,大家好,我需要制作一个模板html文件并更改其中的特定数据。 I've been searching how to do so and all I found was this: 我一直在寻找这样做的方法,发现的是:
<div w3-include-html="tmp1.html"></div>
<script>
function includeHTML() {
var z, i, elmnt, file, xhttp;
/*loop through a collection of all HTML elements:*/
z = document.getElementsByTagName("*");
for (i = 0; i < z.length; i++) {
elmnt = z[i];
/*search for elements with a certain atrribute:*/
file = elmnt.getAttribute("w3-include-html");
if (file) {
/*make an HTTP request using the attribute value as the file name:*/
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4) {
if (this.status == 200) {elmnt.innerHTML = this.responseText;}
if (this.status == 404) {elmnt.innerHTML = "Page not found.";}
/*remove the attribute, and call this function once more:*/
elmnt.removeAttribute("w3-include-html");
includeHTML();
}
}
xhttp.open("GET", file, true);
xhttp.send();
/*exit the function:*/
return;
}
} } }}
But this code just copy tmp1.html and I am unable to change specific data of the file without changing the file. 但是这段代码只是复制了tmp1.html而我无法在不更改文件的情况下更改文件的特定数据。 Does it possible to do so? 有可能这样做吗? Sorry if it's have been asked before... 抱歉,之前是否有人问过...
You're using a simple include system and not a template system. 您使用的是简单的包含系统,而不是模板系统。
Use a proper template system instead. 请使用适当的模板系统。 There are many for JavaScript including Nunjucks which would let you do something like: JavaScript有很多功能 ,包括Nunjucks ,可以让您执行以下操作:
var html = nunjucks.render('tmp1.html', { foo: 'bar' });
document.body.insertAdjacentHTML('beforeend', html);
with a template like: 使用如下模板:
<div>My data is: {{foo}}</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.