1.新建index.html ,将dist/main.js引入到html页面
2.写一行div,<div id="template"></template>
3.mian.js 内代码
let template = '<h1>Template</h1><p>this is template</p>';
document.getElementById('template').innerHTML = template;
浏览器刷新,代码生效
4.多行写法
a.
let template =
'<h1>Template</h1>' +
'<p>this is template</p>';
document.getElementById('template').innerHTML = template;
b.
let template =
`<h1>Template</h1>
<p>this is template</p>`;
document.getElementById('template').innerHTML = template;
5.嵌套变量
let name = 'Tim';
let template =
`<h1>Template ${name}</h1>
<p>this is template</p>`;
document.getElementById('template').innerHTML = template;
6.函数嵌套
let name = 'Tim';
function makeUpperCase(word) {
return word.toUpperCase();
}
let template =
`<h1>${makeUpperCase('Template')} ${name}</h1>
<p>this is template</p>`;
document.getElementById('template').innerHTML = template;