写入控制台到未链接的 html

Question

我的问题如下：是否可以将 .js 文件中的内容写入非链接 HTML 文件的控制台？

所以我有以下设置：单击 html_1(index.html) 上的按钮时，它会打开一个新的 window，而这个 window 有一个 HTML 称为 html_2(numero.html)。我希望当弹出 window 打开时在 index.html 的控制台中写一些东西（使用 onload）。这两个 HTML 文件都链接到它们自己单独的 .js 文件（index.js 和 numero.js）。我想从 numero.js 到 index.html 写入控制台，但它们没有链接。

这可能吗？

我现在有什么

HTML 指数 <button onclick="newWindow();" id="ventana" >ACIERTA NUMERO</button> 打开新的 window。

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="Stylesheet1.css">
    <script type="text/javascript" src="objectosPredef.js"></script>
    <title>Actividad 2</title>
</head>
<body onload="listaPropiedades()">
    <div id="listaPropiedades"></div>
    
    <input type="text" id="nombre" placeholder="entra tu nombre" />
    <button onclick="crearCookie();">Click</button>
    <button onclick="newWindow();" id="ventana" >ACIERTA NUMERO</button>
</body>

</html>

Index.js

function newWindow(url, title, w, h) {
    var url = "numero.html";
    var title = "";
    var w = 300;
    var h = 300;
    var left = (screen.width / 2) - (w / 2);
    var top = (screen.height / 2) - (h / 2);
    return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);
}

HTML 数字

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    
    <script type="text/javascript" src="numero.js"></script>
    <title>count down</title>
</head>
<body onload="windowTimer()">
    <div id="random"></div>
    <div id="timer"></div>
    
</body>
</html>

Numero JS

function windowTimer() {
    consoleLog();

    var sec = 8;
    setInterval(function () {
        document.getElementById("timer").innerHTML = sec + " :segundos";
        
        sec--;
        if (sec == -1) {
            window.close();
        }
    }, 1000);
}

function consoleLog() {
    var x = Math.floor((Math.random() * 11));
    document.getElementById("random").innerHTML = "Numero aleatorio: " + x;
}

目前它只是将随机数写入 windows 但它应该进入 index.html 的控制台日志。我找不到任何关于此的信息。感谢任何帮助。

Answer 1

为了说明我的评论，我根据问题快速制作了一个包含 2 个文件 index.html 和 numero.html 的小演示。

index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Index.html</title>
    </head>
    <body>
    
        <button onclick="newWindow();" id="ventana">ACIERTA NUMERO</button>
        
        
        <script>
            function newWindow( url = "numero.html", title = "", w = 300, h = 300 ) {
                var left = (screen.width / 2) - (w / 2);
                var top = (screen.height / 2) - (h / 2);
                return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=' + w + ', height=' + h + ', top=' + top + ', left=' + left);
            }
        
        
            let oChannel=new BroadcastChannel( 'numero' );
                oChannel.addEventListener('message',(e)=>{
                    if( e.data.number )console.info('Random Number generated in "numero.html": %s', e.data.number )
                    else console.info( e.data.data )
                });
        </script>
    </body>
</html>

numero.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Numero.html</title>
    </head>
    <body>
        <div id="random"></div>
        <div id="timer"></div>
        <script>
            document.addEventListener('DOMContentLoaded',()=>{
            
                let oChannel=new BroadcastChannel( 'numero' );
                
                const Log=()=>{
                    let i=Math.floor( ( Math.random() * 11 ) );
                    document.getElementById("random").innerHTML = "Numero aleatorio: " + i;
                    console.info('Numero aleatorio: %d',i);
                    return i;
                };
                
                function windowTimer() {
                    let sec=8;
                    
                    setInterval(function () {
                        if( sec > 0 ){
                            oChannel.postMessage({data:sec})
                            document.getElementById("timer").innerHTML = sec + " :segundos";
                        }else if( sec==0 ) {
                            oChannel.postMessage({data:'Goodbye'});
                            window.close();
                        }
                        
                        sec--;
                        
                    }, 1000 );
                };
                
                let _random_number=Log();
                oChannel.postMessage( { data:'loaded', number:_random_number } );
                
                windowTimer();
            })
            
        </script>
    </body>
</html>

两个页面都必须创建自己的到公共频道的连接 - 名称是任意的，但两者必须相同。 index 页面 listens 显示来自子弹出页面 numero.html 的消息，并显示弹出窗口使用 postMessage 函数发送的数据。

写入控制台到未链接的 html

Writing to console to an html that is not linked

html

javascript

css

console