如何改变元素节点中的内容

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="box"></div>
    <div id="box1"></div>
    <script>
        var oBox = document.getElementById("box");
        var oBox1 = document.getElementById("box1");
        // innerHTML 属性能以HTML语法设置节点中的内容
        // oBox.innerHTML = '慕课网';
        oBox.innerHTML ='<ul><li>牛奶</li><li>西瓜</li></ul>';

        // innerText 属性只能以纯文本的形式设置节点中的内容
        // oBox.innerText = '慕课网';
        oBox1.innerText = '<ul><li>牛奶</li><li>西瓜</li></ul>';
    </script>
</body>
</html

Document

改变元素节点中的内容可以使用两个相关的属性
- 1，==innerHTML== 2, ==innerText==
- ==innerHTML== 属性能以HTML语法设置节点中的内容
- ==innerText== 属性只能以纯文本的形式设置节点中的内容