字符串模板 - 掘金

1.字符串需要用一对反引号包裹起来，他可以定义多行字符串，只用一对反引号
2.要拼进去的数据需要 放在${}里面
3.大括号里面可以进行运算
4.大括号里面可以调用函数
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>字符串模板</title>
</head>
<body>
    <article id="list">
        <h1></h1>
        <p></p>
    </article>
</body>
</html>

<script>
    'use strict'
    let obj={
        title:'梦',
        content:'梦的实现',
    }
    let Ele=document.getElementById('list')
    // 以前的方式  innerHTML(字符串拼接的方式)
    Ele.innerHTML='<h1>'+obj.title+'</h1><p>'+obj.content+'</p>'
    // 现在的方法（字符串模板）
    Ele.innerHTML=`<h1>${obj.title}</h1><p>${obj.content}</p>`

    // 调用函数
    function fn() {
        return '少年'
    }
    Ele.innerHTML=`<h1>${fn()+obj.title}</h1><p>${fn()+obj.content}</p>`
</script>