返回DOM热身运动......登陆

DOM热身运动机器人聊天1

Time2019-03-14 16:39:571623

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <title>demo11</title>

    </head>

    <body>

         

                <input type="text" name="userame" />

                <button>提交</button>

                <ul></ul>

            <script>

                    //获取元素

                    let input = document.getElementsByName('userame')[0];

                        let button = document.getElementsByTagName('button')[0];

                        let ul = document.getElementsByTagName('ul')[0];

                         

                    button.onclick=function(){

                     

                        let li =document.createElement("li"); //创建列表li

                            li.innerHTML=input.value;//填充信息

                            ul.appendChild(li);//插入 添加

                            input.value="";//清空文本框

                    };

                     

            </script>

            <!--

                总结:利用dom获取到相应的元素 文本框 按钮 ul容器,按钮点击触发函数function内部 let定义变量li 并创建li

                      创建出的li并填充 插入进去ul 最后清空文本框

            -->

    </body>

</html>


最新手记推荐

• 用composer安装thinkphp框架的步骤• 省市区接口说明• 用thinkphp,后台新增栏目• 管理员添加编辑删除• 管理员添加编辑删除

全部回复(0)我要回复

暂无评论~
  • 取消回复发送