Uzyskaj wszystkie elementy iframe

Hej chłopaki mam wykazujące wskaźnik ładowania podczas gdy niektóre iframes zewnętrzne są ładowane z następującego kodu:Uzyskaj wszystkie elementy 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>

Problem polega biegnę około 50 mini iframe na stronie i I don” t fantazyjne przepisanie kodu powyżej, aby dopasować każdy identyfikator iframe lol ... tak jestem, że wiele początkujących w js haha

Czy istnieje sposób mogę dopasować każdego identyfikatora iframe z regex przykład loading_iframe1 loading_iframe2 loading_iframe3

Mam nadzieję, że ma sens?

Wszelkie pomysły

Źródło

2010-09-22 Webby

Dodałem to do mojej odpowiedzi, ale nie powinieneś umieszczać '

Najpierw <script> tagi powinny iść albo w <head> lub <body> ale nie pomiędzy!

chciałbym zmienić schemat nazewnictwa lekko do tego:

<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>

Teraz wystarczy do pętli przez wszystkie iframe i można łatwo uzyskać dostęp do odpowiedniego div poprzez zmianę identyfikatora +"-L"

uzyskać wszystkie elementy iframe używać getElementsByTagName(), następnie iteracyjne nad tymi, z pętli for:

coś takiego:

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 = ""; 
    } 
}

Źródło

2010-09-22 22:17:04

Po prostu dodając do odpowiedzi Jeff: Naprawdę polecam, aby sprawdzić jQuery. Jest bardzo potężny i takie zadanie powinno być dość proste. Biorąc pod uwagę, że dają sobie iFrame klasa „loading_iframe” można zrobić coś takiego:

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

console.log() zakłada, że wezwanie użyć FireBug Firefox lub Google Chrome. Nie wiem, czy działa to w innych przeglądarkach.

Zobacz także document for .each().

Źródło

2010-09-22 22:36:37 spier

Stereotypowe przepełnienie stosu "słyszałeś o jquery" Odpowiedź :) – marcospgp

Tak, nie ma nic magicznego w jQuery, możesz to zrobić również bez niego: 'Array.prototype.forEach.call (document.getElementsByClassName (" loading_frame ") , function (frame) {console.log (frame);}) '. Nieco bardziej gadatliwy, ale można go przekształcić we wspólny przypadek użycia i nie trzeba ładować jQuery. – amn

Powiązane problemy