【jQuery】常用API——jQuery属性操作

最新推荐文章于 2024-05-15 20:43:52 发布

早睡早起长头发

最新推荐文章于 2024-05-15 20:43:52 发布

阅读量183

点赞数

分类专栏： jQuery 文章标签： jquery javascript 前端 Powered by 金山文档

本文链接：https://blog.csdn.net/weixin_51481135/article/details/128599717

版权

jQuery 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

一、设置或获取元素固有属性值 prop()

所谓元素固有属性就是元素本身自带的属性，比如 <a> 元素里面的 href ，比如 <input> 元素里面的 type。

1. 获取属性语法

prop(''属性'');

2. 设置属性语法

prop(''属性'', ''属性值'');

    <script src="../jquery.min.js"></script>
</head>

<body>
    <a href="http://www.itcast.cn" title="都挺好">都挺好</a>
    <!-- checked：默认选上 -->
    <input type="checkbox" name="" id="" checked> 
    
    <script>
        // 设置或获取元素固有属性值 prop() 
        $(function () {
            // prop("属性名") 获取元素固有的属性值
            console.log($("a").prop("href"));
            $("input").change(function () {
                console.log($(this).prop("checked"));
            });
            // prop(''属性'', ''属性值'') 设置元素属性
            $("a").prop("title", "我们都挺好");
        })
    </script>
</body>

二、设置或获取元素自定义属性值 attr()

用户自己给元素添加的属性，我们称为自定义属性。比如给 div 添加 index =“1”。

1. 获取属性语法

attr(''属性''); // 类似原生 getAttribute()

2. 设置属性语法

attr(''属性'', ''属性值''); // 类似原生 setAttribute()

该方法也可以获取 H5 自定义属性。

    <script src="../jquery.min.js"></script>
</head>

<body>
    <!-- index：自定义属性；data-index：H5自定义属性 -->
    <div index="1" data-index="2">我是div</div>

    <script>
        $(function () {
            // 元素的自定义属性 我们通过 attr()
            // 获取
            console.log($("div").attr("index"));
            // 设置
            $("div").attr("index", 4);
            // 该方法也可以获取 H5 自定义属性
            console.log($("div").attr("data-index"));
        })
    </script>
</body>