2. 模板字符串

模板字符串：使用``来直接写入dom结构，使用 ${变量名}在指定的地方插入变量

<div class="box"></div>

<script>
    const oBox = document.querySelector('.box');
    let id = 'x',
        name = 'Max';
    
	//js传统写法--- "<ul><li><p>id:" + id + "</p><p>name:" + name + "</p></li></ul>"
    
    let htmlStr = ` 
        <ul>
            <li>
                <p id='${id}'>${name}</p>
            </li>
        </ul>
        `;    //es6模板字符串写法

    oBox.innerHTML = htmlStr;
</script>