javascript - que - Java Script, dificultad para obtener la lista de todos los marcos anidados en la página
for en javascript (3)
El problema es el evento en el que llamas a esto. $(document).ready() se activa cuando se carga el DOM actual. Así que se dispara cuando se cargan los 3 marcos principales. Pero en este punto estos marcos no iframes sus iframes todavía. Al cambiar el evento a window.onload , debería tener el resultado esperado. Me gusta esto:
$(window).load(function(){
...
o
window.onload = function(){
...
Consulte window.onload : https://developer.mozilla.org/en/docs/Web/API/GlobalEventHandlers/onload
El evento de carga se dispara al final del proceso de carga del documento. En este punto, todos los objetos en el documento están en el DOM, y todas las imágenes, scripts, enlaces y sub-marcos han terminado de cargarse.
Hola, necesito obtener una lista de todos los marcos para mi script GreaseMonkey pero, de hecho, supongo que es una pregunta general de Javascript . Sería genial si pudiera llegar a cada fotograma que está anidado en la página. Hasta ahora tengo problemas para obtener el número de marcos anidados en los marcos de documentos principales.
La página con la que estoy tratando consiste en un conjunto de marcos que es multinivel y los marcos contienen otros marcos. Logré obtener información sobre los marcos de nivel superior del conjunto de marcos del documento principal (en el nivel de código 1 ), pero en este nivel obtengo información de que el recuento de marcos para estos marcos es igual a 0, lo que no es cierto.
Se me ha ocurrido el siguiente código
$(document).ready(function(){
var frames = window.frames;
var i,j;
var reportText = "level 0 > " + frames.length +"/r/n";
for (i = 0; i < frames.length; i++) {
var frames2 = frames[i].frames;
reportText += "level 1 - " + i + " > " + frames[i].name + " - " + frames2.length +"/r/n";
for (j = 0; j < frames2.length; j++) {
var frames3 = frames2[j].frames;
reportText += "level 2 - " + i + " - " + j + " > " + frames2[j].name + " - " + frames3.length +"/r/n";
}
}
alert(reportText);});
Por lo tanto, el nivel 0, que en realidad es el número de fotogramas del documento principal y los nombres de nivel 1 o los fotogramas del documento principal, se informa correctamente, pero no la cantidad de fotogramas de cada fotograma de nivel 1 . Y quiero saber si es porque mi código tiene errores o quizás porque los subtramas no están completamente cargados.
He intentado llamar a mi código desde el método abreviado del teclado, después de todo, parecerá que está completamente cargado, pero aquí hay otro problema, parece que el siguiente código parece no funcionar con una página que solo consta de un conjunto de marcos
(function(){
document.addEventListener(''keydown'', function(e) {
if (e.keyCode == 72 && !e.shiftKey && !e.ctrlKey && e.altKey && !e.metaKey) {
//...my previous code inside document.ready...
}
}, false);})();
Lo mejor sería si el código repasara automáticamente todos los marcos y subtramas, pero con su forma actual (donde cada nivel tiene su propio bucle) también es bueno.
El problema con la incapacidad de usar la tecla de método abreviado es secundario. Lo principal es obtener recuentos adecuados de marcos dentro de los marcos del documento principal y más allá.
EDIT: Salida de muestra y página de prueba con un conjunto de marcos anidado
Salida
nivel 0> 3
nivel 1 - 0> main1 - 0
nivel 1 - 1> main2 - 0
nivel 1 - 2> main3 - 0
Página de prueba con marcos anidados
frame0.htm
<!DOCTYPE html>
<html>
<frameset cols="25%,*,25%">
<frame id="frmain1" name="main1" src="frame0_1.htm">
<frame id="frmain2" name="main2" src="frame0_2.htm">
<frame id="frmain3" name="main3" src="frame0_3.htm">
</frameset>
</html>
frame0_1.htm
<!DOCTYPE html>
<html>
<frameset rows="25%,*">
<frame id="frsub11" name="sub11" src="frame0_1_1.htm">
<frame id="frsub12" name="sub12" src="frame0_1_2.htm">
</frameset>
</html>
frame0_1_1.htm
<!DOCTYPE html>
<html>
<body style="background: darkorange;">
</body>
</html>
frame0_1_2.htm
<!DOCTYPE html>
<html>
<body style="background: lightyellow;">
</body>
</html>
frame0_2.htm
<!DOCTYPE html>
<html>
<frameset rows="25%,*,25%">
<frame id="frsub21" name="sub21" src="frame0_2_1.htm">
<frame id="frsub22" name="sub22" src="frame0_2_2.htm">
<frame id="frsub23" name="sub23" src="frame0_2_3.htm">
</frameset>
</html>
frame0_2_1.htm
<!DOCTYPE html>
<html>
<body style="background: skyblue;">
</body>
</html>
frame0_2_2.htm
<!DOCTYPE html>
<html>
<body style="background: cornflowerblue;">
</body>
</html>
frame0_2_3.htm
<!DOCTYPE html>
<html>
<body style="background: slateblue;">
</body>
</html>
frame0_3.htm
<!DOCTYPE html>
<html>
<frameset rows="25%,*">
<frame id="frsub31" name="sub31" src="frame0_3_1.htm">
<frame id="frsub32" name="sub32" src="frame0_3_2.htm">
</frameset>
</html>
frame0_3_1.htm
<!DOCTYPE html>
<html>
<body style="background: darkgreen;">
</body>
</html>
frame0_3_2.htm
<!DOCTYPE html>
<html>
<body style="background: lightgreen;">
<a id="test" href="http://www.google.com">testlink</a>
</body>
</html>
frameset no es compatible con html5 .
Por favor vea la siguiente demo: frameset Demo . He modificado los archivos htm. La idea es escuchar el evento onload de frameset y acceder a su contenido después de que se active el evento onlnoad.
Para acceder al contenido del marco secundario, se debe invocar la política del mismo origen .
Solución de código de trabajo
Use una función recursiva y el evento de load la window , así (funciona en las últimas versiones de Chrome, FireFox y Edge; no probó otros. Probablemente también funciona en IE5 +).
Utilice este código en su frameset nivel superior, frame0.htm :
<!DOCTYPE HTML Frameset DTD>
<html>
<head>
<script>
window.onload = function()
{
var allFrames = [];
function recursFrames(context)
{
for(var i = 0; i < context.frames.length; i++)
{
console.log(context.frames[i].name + " -- " + context.frames[i].location.href);
allFrames.push(context.frames[i]);
recursFrames(context.frames[i]);
}
}
recursFrames(window);
console.log("Frames count: " + allFrames.length);
}
</script>
</head>
<frameset cols="25%,*,25%">
<frame id="frmain1" name="main1" src="frame0_1.htm">
<frame id="frmain2" name="main2" src="frame0_2.htm">
<frame id="frmain3" name="main3" src="frame0_3.htm">
</frameset>
</html>
Esto escribe en la consola solo para mostrarle lo que está sucediendo, pero, por supuesto, puede hacer lo que quiera con esta información. Crea una lista plana (matriz) de todos los marcos secundarios, pero podría estructurarla jerárquicamente si lo desea, o lo que sea.
HTML 5 Recordatorio
Está utilizando el DOCTYPE HTML5, pero el frameset no es compatible con HTML5. Pero depende del navegador decidir cuándo dejar de admitir esto, y muchos de ellos aún lo hacen. Le recomiendo que deje de usar frameset antes posible. En su lugar, use iframe si necesita un comportamiento similar a un marco (diferentes ventanas y documentos).