Hàm document.images trong Javascript - Javascript Function
Code RUN <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style type="text/css"> #result{ color: red; font-size: 20px; font-weight: bold; ...
Images collection sẽ trả về tập hợp các thẻ <img>
có trong trang.
Collection có thể hiểu như là một bộ chọn có các thuộc tính và phương thức như một object, nó sẽ chọn lấy một tập hợp kết quả.
Các thẻ trong tập hợp được trả về sẽ được sắp xếp theo đúng thứ tự chúng xuất hiện trên trang.
Cú pháp
Cú pháp: document.images
Thuộc tính
Phương thức
Cách sử dụng
Đếm số thẻ <img>
có trên trang:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style type="text/css"> #result{ color: red; font-size: 20px; font-weight: bold; } </style> </head> <body> <h1>Học lập trình miễn phí tại Zaidap.com.net</h1> <img src="#"> <img src="#2"> <p id="result"></p> <button onclick="myFunction()">Xem kết quả</button> <script> function myFunction(){ var lenght = document.images.length; document.getElementById("result").innerHTML = "Số thẻ 'img' trong trang là: " + lenght; } </script> </body> </html>
Vậy là tổng số thẻ <img>
có trong trang đã được in ra.
Hiển thị giá trị id
của thẻ <img>
thứ nhất:
<!DOCTYPE html> <html> <head id="demoHead"> <meta charset="utf-8"> <style type="text/css"> #result{ color: red; font-size: 20px; font-weight: bold; } </style> </head> <body> <h1>Học lập trình miễn phí tại Zaidap.com.net</h1> <img src="#" id="image-1"> <img src="#2" id="image-2"> <p id="result"></p> <button onclick="myFunction()">Xem kết quả</button> <script> function myFunction(){ var lenght = document.images[0].id; document.getElementById("result").innerHTML = "ID của thẻ head là: " + lenght; } </script> </body> </html>
Tham khảo: w3schools.com
Nguồn: Zaidap.com.net