jQuery中的attr()和prop()使用

最新推荐文章于 2025-08-21 23:36:32 发布

转载最新推荐文章于 2025-08-21 23:36:32 发布 · 57 阅读

0 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/LiuChunfu/p/4991308.html

文章标签：

#javascript #ViewUI

本文通过对比jQuery中的prop()和attr()方法，详细解释了它们在处理HTML元素属性时的不同表现，并提供了实际应用案例。重点强调了在特定情况下的使用建议。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

总结：除了checked、seleted这样的属性推荐用prop()外，其他的随意都可以。

原因如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title></title>
    <script type="text/javascript" src="../js/lib/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
        function testCheck() {
            var result1 = $("#check").prop("checked"); //结果是true
            var result2 = $("#check").attr("checked"); //结果是checked
            console.info("被选择的情况下" + "result1:" + result1 + "||result2:" + result2);
        }
        function testNoCheck() {
            var result1 = $("#nocheck").prop("checked"); //结果是false
            var result2 = $("#nocheck").attr("checked"); //结果是undefined
            console.info("未有选择的情况下" + "result1:" + result1 + "||result2:" + result2);
        }

        $(function () {
            testCheck();//被选择的情况下result1:true||result2:checked
            testNoCheck();//未有选择的情况下result1:false||result2:undefined
        })
    </script>
</head>
<body>
<input id="check" type="checkbox" value="football" checked="checked">足球
<input id="nocheck" type="checkbox" value="football">篮球
</body>
</html>