Javascript 位置替换太慢_Javascript_Html_Css

Javascript 位置替换太慢

javascript html css

Javascript 位置替换太慢,javascript,html,css,Javascript,Html,Css,你好，我正在尝试制作一个带有语言选择菜单的网站。选择一种语言后，将设置cookies。如果您访问该网站，javascript应将您重定向到包含所选语言内容的网页。我的问题是，在页面更改之前，菜单会显示1秒。我希望在页面加载时将javascript替换为location.replace 代码如下： HTML JAVASCRIPT document.getElementById('notpage').style.visibility= 'hidden'; /* Deze function is

你好，我正在尝试制作一个带有语言选择菜单的网站。选择一种语言后，将设置cookies。如果您访问该网站，javascript应将您重定向到包含所选语言内容的网页。我的问题是，在页面更改之前，菜单会显示1秒。我希望在页面加载时将javascript替换为location.replace 代码如下： HTML

JAVASCRIPT

document.getElementById('notpage').style.visibility= 'hidden';

/* Deze function is gecomment om development makelijker te maken. Na afloop deze function weer gebruikbaar maken*/
function checkCookie() 
{
    var language = getCookie('language');

    if (language === 'nederlands')
   {                                 
     location.replace("nlhome.html");   
    }

    else if (language === 'engels'){
      location.replace("enhome.html");
    }

}


function setCookie(cname, cvalue, exdays) {
    var d = new Date();
    d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
    var expires = "expires=" + d.toGMTString();
    document.cookie = cname + "=" + cvalue + "; " + expires;
}

function getCookie(cname) {
    var name = cname + "=";
    var ca = document.cookie.split(';');
    for (var i = 0; i < ca.length; i++) {
        var c = ca[i];
        while (c.charAt(0) == ' ')
            c = c.substring(1);
        if (c.indexOf(name) === 0) {
            return c.substring(name.length, c.length);
        }
    }
    return "";
}





function continuescriptNL() 
{
    var child = document.getElementById("overlay");
    child.parentNode.removeChild(child);
    window.setTimeout(stillgoingNL, 500);
}

function continuescriptEN() 
{
    var child = document.getElementById("overlay");
    child.parentNode.removeChild(child);
    window.setTimeout(stillgoingEN, 500);
}


function stillgoingNL() 
{
    location.replace("nlhome.html");
}

function stillgoingEN() 
{
    location.replace("enhome.html");
}





function nl() 
{
    var lang = 'nederlands';
    setCookie("language", lang, 30);
    var OverLay = document.getElementById('overlay');
    OverLay.classList.toggle('overlayfade');
    window.setTimeout(continuescriptNL, 2000);
    function stillgoingNL() 
    {
        location.replace("nlhome.html");
    }



}
function en() 
{
    var lang = 'engels';
    setCookie("language", lang, 30);
    var OverLay = document.getElementById('overlay');
    OverLay.classList.toggle('overlayfade');
    window.setTimeout(continuescriptEN, 2000);



}

document.getElementById（'notpage'）.style.visibility='hidden'；
/*Deze功能是GEOM开发makelijker te maken。不适用于gebruikbaar maken的函数*/
函数checkCookie（）
{
var language=getCookie（“语言”）；
如果（语言=='nederlands'）
{                                 
location.replace（“nlhome.html”）；
}
else if（语言===‘恩格斯’）{
location.replace（“enhome.html”）；
}
}
函数setCookie（cname、cvalue、exdays）{
var d=新日期（）；
d、 设置时间（d.getTime（）+（exdays*24*60*60*1000））；
var expires=“expires=“+d.togmString（）；
document.cookie=cname+“=”+cvalue+”；“+expires；
}
函数getCookie（cname）{
变量名称=cname+“=”；
var ca=document.cookie.split（“；”）；
对于（变量i=0；i

请勿在车身的

onload

事件中执行此操作。相反，将代码内联放置在页面顶部（甚至在head部分），以便在解析代码后立即执行。这样，您就可以尽可能快地使用JavaScript

更好的方法是在服务器上执行这些检查，这样就可以立即重定向。在这种情况下，您可以在服务器上执行重定向（url不会改变，但您会得到不同的内容），也可以通过客户端执行普通重定向，在这种情况下，浏览器只需要处理标题并触发新请求，这仍然比通过JavaScript进行重定向更有效。此外，JavaScript是否被执行总是一个猜测。在服务器上，您的控制力更强

另外，对于其他代码，

onload

事件可能不是最佳位置。此事件在加载完整文档（包括图像等）后激发。一个更好的事件是在DOM本身准备就绪时立即触发，但可能在加载所有图像之前触发。此事件非常适合将事件连接到元素和其他类似的初始化代码

但是对于这种特殊情况，您不需要DOM。您只需要尽快重定向，所以根本不要使用任何事件。只需执行代码。

正如其他人已经提到的，服务器端重定向是最快的。如果必须在javascript中进行重定向，请将checkCookie更改为立即执行的表达式

(function checkCookie() {
    var language = getCookie('language');
    if (language === 'nederlands') {                                 
     location.replace("nlhome.html");   
    } else if (language === 'engels') {
      location.replace("enhome.html");
    }
}());

将这个和getCookie函数添加到一个新的js文件中，并将其放在head中

<head>
<script src="javascript\redirection.js"></script>

<!-- Latest compiled and minified CSS -->

这样，在加载页面时，函数checkCookie就会被执行

此外，建议您在此HTML中添加加载微调器覆盖

如果未找到cookie，请删除微调器覆盖。这也可以作为else放入checkCookie函数中

这将防止页面闪存，使重定向更少麻烦。

我意识到这个问题是用JavaScript /CSS标记的，但是您可能希望考虑将语言重定向逻辑转换为服务器端代码。这样，页面就不必在检查cookies之前等待所有内容加载。或者将您的

checkCookie

调用移动到另一个事件，而不是

onload

，因为onload将等待所有内容加载。您的页面正在请求获取新页面。

(function checkCookie() {
    var language = getCookie('language');
    if (language === 'nederlands') {                                 
     location.replace("nlhome.html");   
    } else if (language === 'engels') {
      location.replace("enhome.html");
    }
}());

<head>
<script src="javascript\redirection.js"></script>

<!-- Latest compiled and minified CSS -->