Thuộc tính CSS có dấu gạch ngang trong jQuery
Giả sử thuộc tính, như thường thấy trong CSS, bao gồm nhiều từ, được phân tách bằng dấu gạch ngang:
<p class="www">văn bản</p>
Trong trường hợp này không có vấn đề gì - nó được viết trong mã Javascript giống như trong CSS:
$('.www').css('font-size', '20px');
Nếu bạn muốn thiết lập nhiều thuộc tính CSS,
bạn có thể truyền vào phương thức css
một đối tượng làm tham số, với các khóa của đối tượng
là các thuộc tính CSS, và giá trị của đối tượng
là giá trị của các thuộc tính CSS:
$('.www').css({color: 'red', font: '12px Arial'});
Tuy nhiên, ở đây sẽ có vấn đề với các thuộc tính như
font-size
- bạn cần viết không phải là font-size,
mà là fontSize:
$('.www').css({color: 'red', fontSize: '12px'});
Nếu bạn không thích làm như vậy - hãy đặt
khóa font-size trong dấu nháy kép:
$('.www').css({color: 'red', 'font-size': '12px'});
Như bạn thấy, jQuery cung cấp nhiều biến thể sử dụng các phương thức tùy thuộc vào sở thích của bạn. Hãy sử dụng cái nào thuận tiện hơn cho bạn.
Hãy làm cho tất cả các thẻ h3 có chữ đậm
với màu xanh lá cây.
Hãy làm cho tất cả các thẻ h2 có màu xanh lam và
font-size: 30px.
