Tutorial jQuery: Bagaimana untuk menetapkan nilai berbilang atribut elemen pada masa yang sama

jQuery ialah perpustakaan JavaScript popular yang digunakan secara meluas dalam pembangunan web. Ia memudahkan operasi JavaScript dalam halaman web, membolehkan pembangun menyelesaikan pelbagai operasi dengan lebih cepat dan cekap. Dalam pembangunan web, kita sering menghadapi situasi di mana kita perlu menetapkan berbilang nilai atribut sesuatu elemen pada masa yang sama jQuery menyediakan kaedah yang mudah untuk mencapai fungsi ini.

Dalam tutorial ini, kami akan memperkenalkan cara menggunakan jQuery untuk menetapkan nilai berbilang atribut elemen pada masa yang sama, dan memberikan contoh kod khusus. Mari belajar bersama!

1. Perkenalkan perpustakaan jQuery

Pertama, kita perlu memperkenalkan perpustakaan jQuery ke dalam halaman web. Ia boleh diperkenalkan dengan cara berikut:

<script src="https://cdn.staticfile.org/jquery/3.6.0/jquery.min.js"></script>

2. Tetapkan nilai berbilang atribut sesuatu elemen

Dalam jQuery, anda boleh menggunakan kaedah attr() untuk menetapkan berbilang nilai atribut ​​unsur pada masa yang sama. Sebagai contoh, kami mempunyai elemen <div>: attr()方法来同时设置元素的多个属性值。例如，我们有一个<div>元素：

<div id="myDiv"></div>

我们想要同时设置这个<div>元素的style、class和data属性值，可以通过以下代码来实现：

$(document).ready(function(){
    $("#myDiv").attr({
        "style": "background-color: red; width: 100px; height: 100px;",
        "class": "myClass",
        "data": "example data"
    });
});

以上代码中，我们使用了attr()方法，传入一个包含多个属性和值的对象。这样我们就可以一次性设置<div>

    
    <script src="https://cdn.staticfile.org/jquery/3.6.0/jquery.min.js"></script>




<div id="myDiv"></div>

<script>
    $(document).ready(function(){
        $("#myDiv").attr({
            "style": "background-color: red; width: 100px; height: 100px;",
            "class": "myClass",
            "data": "example data"
        });
    });
</script>

rrreee