两个问题,感谢老师

来源:4-10 自由编程

qq_鸭绿桥第一帅哥_0

2019-07-18 10:21:33

  1. 请老师过目我的代码

  2. .append是jquery方法;.appendChild是javascript方法。对吗?

  3. <!DOCTYPE html>
    <html>
    
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    
    <body>
        <button>添加</button>
        <ul>
            <li>111</li>
            <li>222</li>
            <li>333</li>
            <li>444</li>
        </ul>
        <script src="https://cdn.bootcss.com/zepto/1.1.7/zepto.min.js"></script>
        <script>
        /*此处写代码*/
        var len=$('ul li').length;
            $('ul').on('mouseenter', 'li', function(event) {
                $(this).css('background', 'red');
            }).on('mouseleave', 'li', function(event) {
                $(this).css('background', '');
            });
            $('button').on('click', function(event) {
               len++;
               var newLi=document.createElement('li');
               newLi.innerText=111*(len);
               $('ul').append(newLi);
            });
        </script>
    </body>
    
    </html>
写回答

1回答

好帮手慕星星

2019-07-18

同学你好,代码实现效果没有问题,很棒哦!

append是jquery中的方法,appendChild是js中的方法,都有插入节点的效果。但是js中也可以用append,插入的是字符串,不是节点,如下:

(1)js中使用:

http://img.mukewang.com/climg/5d301a030001934004770039.jpg

效果:

http://img.mukewang.com/climg/5d301a0a0001d31701930036.jpg

(2)jquery中使用:

http://img.mukewang.com/climg/5d301a760001f54304310043.jpg

http://img.mukewang.com/climg/5d301a7d0001386d01670090.jpg

效果不一致,js中不会解析。

自己可以测试下,祝学习愉快!

0

0 学习 · 3299 问题

查看课程