Ottenere tutti gli elementi iframe

Hey ragazzi io sto mostrando un indicatore di carico, mentre alcuni iframe esterni sono caricati con il seguente codice:Ottenere tutti gli elementi 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>

Il problema è che sto correndo circa 50 mini iframe per pagina e io don' t fantasia riscrivere il codice di cui sopra per far combaciare ogni iframe id lol ... sì sono che molto di un novizio in js haha

c'è un modo ho potuto abbinare ogni iframe id con un esempio di espressione regolare loading_iframe1 loading_iframe2 loading_iframe3

La speranza aveva senso?

Tutte le idee

fonte

2010-09-22 Webby

Aggiunto alla mia risposta, ma non dovresti mettere i tag '

In primo luogo, <script> tag dovrebbe andare sia nella <head> o <body> ma non in mezzo!

vorrei cambiare il tuo schema di denominazione un po 'a questo:

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

Ora non resta che scorrere tutti gli iframe, e si può facilmente accedere al div corrispondente modificando l'ID di +"-L"

per ottenere tutti i iframe elementi usano getElementsByTagName(), poi iterare su quelli con un ciclo for:

Qualcosa di simile a questo:

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

fonte

2010-09-22 22:17:04

Solo aggiungendo alla risposta di Jeff: Vi consiglio davvero di controllare jQuery. È molto potente e un compito come questo dovrebbe essere abbastanza semplice. Dato che si dà ogni iFrame un "loading_iframe" classe che si può fare qualcosa di simile:

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

La chiamata console.log() presuppone che si utilizzi Firebug in Firefox o Google Chrome. Non sono sicuro che funzioni in altri browser.

Vedere anche document for .each().

fonte

2010-09-22 22:36:37 spier

Overflow di stack stereotipati "hai sentito parlare di jquery" rispondi :) – marcospgp

Sì, non c'è nulla di magico in jQuery, puoi farlo anche senza: 'Array.prototype.forEach.call (document.getElementsByClassName (" loading_frame ") , function (frame) {console.log (frame);}) '. Un po 'più verboso ma puoi refactoring nel tuo caso d'uso comune e non devi caricare jQuery. – amn

Problemi correlati