Nhận tất cả các yếu tố iframe

Hey guys Tôi đang cho thấy một chỉ số tải trong khi một số iframe bên ngoài được nạp với đoạn mã sau:Nhận tất cả các yếu tố iframe

<html> 

<head> 
    <title>Loading iframe</title> 
</head> 

<script> 


function loading_iframe(){ 
    document.getElementById('loading_iframe').style.display = "none"; 
    document.getElementById('loading').style.display = ""; 
    document.getElementById('loading_iframe').onload = function(){ 
     document.getElementById('loading').style.display = "none"; 
     document.getElementById('loading_iframe').style.display = ""; 
    } 
} 
</script> 

<body> 
<iframe id="loading_iframe" src="iframe.html" width="800" height="100"></iframe> 
<div id="loading">Loading...</div> 


<script> 
loading_iframe(); 

</script>

Vấn đề là tôi đang chạy khoảng 50 iframe nhỏ mỗi trang và tôi don' t ưa thích viết lại đoạn mã trên để phù hợp với từng iframe id lol ... vâng tôi rằng có rất nhiều người mới tại js haha

có cách nào tôi có thể phù hợp với từng iframe id với một ví dụ regex loading_iframe1 loading_iframe2 loading_iframe3

Hy vọng có ý nghĩa?

Bất kỳ ý tưởng

Nguồn

2010-09-22 Webby

Thêm nó vào câu trả lời của tôi, nhưng bạn không nên đặt các thẻ '

Thứ nhất, <script> thẻ nên đi hoặc trong <head> hoặc <body> nhưng không phải ở giữa!

tôi sẽ thay đổi sơ đồ đặt tên bạn một chút để này:

<iframe id="iframe1" src="iframe.html" width="800" height="100"></iframe> 
<div id="iframe1-L">Loading...</div> 

<iframe id="iframe2" src="blah.html" width="800" height="100"></iframe> 
<div id="iframe2-L">Loading...</div>

Bây giờ bạn chỉ có để lặp qua tất cả các iframe, và bạn có thể dễ dàng truy cập vào div tương ứng bằng cách thay đổi ID để +"-L"

Để có được tất cả các thành phần iframe sử dụng getElementsByTagName(), sau đó lặp lại qua những người có vòng lặp for:

Something như thế này:

var i, frames; 
frames = document.getElementsByTagName("iframe"); 
for (i = 0; i < frames.length; ++i) 
{ 
     // The iFrame 
    frames[i].style.display = "none"; 
     // The corresponding DIV 
    getElementById(frames[i].id + "-L").style.display = ""; 
    frames[i].onload = function() 
    { 
     getElementById(frames[i].id + "-L").style.display = "none"; 
     frames[i].style.display = ""; 
    } 
}

Nguồn

2010-09-22 22:17:04

Chỉ cần thêm vào câu trả lời của Jeff: Tôi thực sự khuyên bạn nên xem jQuery. Nó rất mạnh mẽ và một nhiệm vụ như thế này khá đơn giản. Cho rằng bạn cung cấp cho mỗi iFrame một lớp "loading_iframe" bạn có thể làm điều gì đó như:

$(".loading_iframe").each(function(index) { 
    console.log(this); ; 
});

Các console.log() gọi giả định rằng bạn sử dụng Firebug trên Firefox hoặc Google Chrome. Không chắc chắn nếu điều đó hoạt động trong các trình duyệt khác.

Cũng xem document for .each().

Nguồn

2010-09-22 22:36:37 spier

Tràn ngăn xếp khuôn mẫu "bạn có nghe nói về jquery" trả lời :) – marcospgp

Vâng, không có gì huyền diệu về jQuery, bạn có thể làm điều này mà không có nó: 'Array.prototype.forEach.call (document.getElementsByClassName (" loading_frame ") , function (frame) {console.log (frame);}) '. Một chút chi tiết hơn nhưng bạn có thể cấu trúc lại nó vào trường hợp sử dụng phổ biến của bạn và bạn không cần tải jQuery. – amn

Các vấn đề liên quan