动态创建元素

使用的DOM动态创建元素，要经历以下3个步骤；

1.创建元素，调用方法createElemnet()

2设置元素，调用方法createTextNode()

3.添加到DOM中，调用方法appendChild()

 

<!DOCTYPE html>
<html>
    <head>
        <title>动态创建元素</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <ul id="ul">
            <li>油条</li>
            <li>包子</li>
            <li>米饺</li>
            <li>鱼粉</li>
        </ul>
        <script>
            var newel = document.createElement('li');
            var newtext = document.createTextNode('豆花');
            newel.append(newtext);
            var elul = document.getElementById('ul');
            elul.appendChild(newel);
        </script>
    </body>
</html>