06/04/2021, 14:48

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:

Code RUN
<!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:

Code RUN
<!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

Hoàng Hải Đăng

24 chủ đề

7226 bài viết

Cùng chủ đề
0