Javascript lấy thuộc tính

Phương thức getAttribute[] của giao diện Element trả về giá trị của một thuộc tính được chỉ định trên phần tử

Nếu thuộc tính đã cho không tồn tại, giá trị được trả về sẽ là


Hi Champ!
0 hoặc

Hi Champ!
1 [chuỗi rỗng];

cú pháp

getAttribute[attributeName]

Thông số

  • 
    Hi Champ!
    
    2 là tên của thuộc tính mà bạn muốn lấy giá trị

Giá trị trả về

Một chuỗi chứa giá trị của


Hi Champ!
2

ví dụ


Hi Champ!

// in a console
const div1 = document.getElementById['div1'];
//=> 
Hi Champ!
const exampleAttr = div1.getAttribute['id']; //=> "div1" const align = div1.getAttribute['align'] //=> null

Sự miêu tả

Vỏ dưới

Khi được gọi trên một phần tử HTML trong DOM được gắn cờ là tài liệu HTML, getAttribute[] viết thường đối số của nó trước khi tiếp tục

Thuộc tính không tồn tại

Tất cả các trình duyệt web hiện đại trả về


Hi Champ!
0 khi thuộc tính được chỉ định không tồn tại trên phần tử được chỉ định

Truy xuất các giá trị nonce

Vì lý do bảo mật, CSP nonce từ các nguồn không phải tập lệnh, chẳng hạn như bộ chọn CSS và lệnh gọi


Hi Champ!
3 bị ẩn

Trong bài viết hướng dẫn tự học lập trình JavaScript này, bạn sẽ tìm hiểu cách lấy, đặt và xóa các thuộc tính khỏi các thành phần HTML trong JavaScript với JS DOM

Google

JavaScript cung cấp một số cách khác nhau để chọn các thành phần trên một trang

Nếu bạn không nhớ thì vui lòng xem lại bài học DOM Selector trong JavaScript nhé

Đặt [Thiết lập] thuộc tính thông qua JS DOM

Phương thức setAttritute[] được sử dụng để thiết lập [thiết lập] thuộc tính trên phần tử đã được chỉ định bằng JS DOM

Nếu thuộc tính đã tồn tại trên phần tử, giá trị được cập nhật

Nếu không, một thuộc tính mới được thêm vào với tên [tên] và giá trị [giá trị] được chỉ định

Đoạn mã JavaScript trong ví dụ sau sẽ thêm một lớp và một thuộc tính bị vô hiệu hóa vào phần tử.


Hi Champ!
6

Như bạn đã thấy ở ví dụ trên, mình đã thêm vào nút thuộc tính mới có tên và giá trị như

+ Một thuộc tính có name là "class" và value là "click-btn"

+ Sau đó, mình lại thiết lập thêm một thuộc tính có name là "disabled" và không có giá trị

Tương tự, bạn có thể sử dụng phương thức setAttribute[] để cập nhật hoặc thay đổi giá trị của một thuộc tính hiện có trên một phần tử HTML

Đoạn mã JavaScript trong ví dụ sau sẽ cập nhật giá trị của thuộc tính href hiện có của thẻ

Tự học JavaScript

Xóa thuộc tính khỏi các phần tử thông qua JS DOM

Phương thức removeAttribute[] được sử dụng để xóa một thuộc tính khỏi thành phần được chỉ định

Đoạn mã JavaScript trong ví dụ sau sẽ xóa thuộc tính href khỏi phần tử neo

NIIT - ICT Hà Nội

Bạn thử chạy ví dụ trên và kiểm tra xem phần tử, có còn thấy thuộc tính href không?

Như vậy, qua bài viết này, mình đã giúp bạn biết cách lấy, đặt thuộc tính và xóa thuộc tính khỏi phần tử HTML thông qua JS DOM

Hi vọng bài viết giúp quá trình học lập trình web của bạn trở nên tốt hơn. Chúc bạn thành công với việc khởi xướng dự án này

Ghi chú. Nếu bạn muốn trở thành Trang web lập trình viên phát triển thực thụ, hãy tham khảo ngay KHÓA HỌC LẬP TRÌNH VIÊN FULL STACK tại NIIT - ICT Hà Nội. Đầu tư 12 tháng, dùng cả đời

Chủ Đề