jQuery中attr()和prop()的区别

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>18-attr和prop方法练习</title>
    <script src="js/jquery-1.12.4.js"></script>
    <script>
        $(function () {
            var btn = document.getElementsByTagName("button")[0];
            btn.onclick = function () {
                var input = document.getElementsByTagName("input")[0];
                var text = input.value;
                $("img").attr("src", text);
                // $("images").prop("src", text);
            }
        });
    </script>
</head>
<body>
<input type="text">
<button>切换图片</button><br>
<img src="https://www.baidu.com/img/bd_logo1.png?where=super" alt="">
</body>
</html>

在input框中输入https://dss0.baidu.com/6ONWsjip0QIZ8tyhnq/it/u=3280118583,682504340&fm=85&app=79&f=JPEG?w=121&h=75&s=5C05F616CD345C0156FCA97E03005073,

然后点击切换图片,效果如下:

 

 

 两个方法都能实现一样的功能,但官方的建议是:具有 true 和 false 两个属性的属性,如 checked, selected 或者 disabled 使用prop(),其他的使用 attr()

posted @ 2020-01-23 17:16  我爱喝酸奶  阅读(113)  评论(0编辑  收藏  举报