es6 - 模板

 1 'use strict';
 2 
 3 
 4 // es5
 5 let name = 'mrs';
 6 let qb = 20;
 7 
 8 function logs() {
 9     return 'goods!';
10 }
11 
12 
13 let html = '<div>' +
14     '<span>hello</span>' +
15     '<span>' + name + '</span>' +
16     '</div>';
17 
18 console.log(html);
19 
20 
21 // es6 -模板
22 let es6html = `
23     <div>
24         <span>hello</span>
25         <ul>
26             <li>${name}</li>
27             <li>${qb}</li>
28             <li>${logs()}</li>
29         <ul>
30     </div>
31 `;
32 
33 console.log(es6html);

 

注意：es6模板的内容框选是``键盘左上角的重音符 ，而es5是双引号或单引号.