Uncaught TypeError: Cannot read property 'style' of null at error.html:84

最新推荐文章于 2024-08-20 18:02:16 发布

梦幽篁

最新推荐文章于 2024-08-20 18:02:16 发布

阅读量2w

点赞数 8

分类专栏：报错 bug 文章标签： js html

本文链接：https://blog.csdn.net/qq_32114025/article/details/86691242

版权

bug 同时被 2 个专栏收录

21 篇文章 0 订阅

订阅专栏

报错

6 篇文章 0 订阅

订阅专栏

要做一个判断，如果是浏览器读到是捷克语言的话，要显示捷克语文案，否则显示英语文案代码如下

<body>
        <script>
                var JsSrc =(navigator.language || navigator.browserLanguage).toLowerCase();
                var sbtitle=document.getElementById("section");
                console.log("weichongbin JsSrc : ",JsSrc," sbtitle.style : " ,sbtitle.style);
                if(JsSrc.indexOf('cs')>=0)
                {
                // 假如浏览器语言是捷克语
                document.getElementById("section").style.display="none";//隐藏
                document.getElementById("sectionCs").style.display="block";//显示
                document.getElementById("section2").style.display="none";//隐藏
                document.getElementById("section2Cs").style.display="block";//显示
                }
                else
                {
                // 假如浏览器语言是其它语言
                document.getElementById("sectionCs").style.display="none";//隐藏
                document.getElementById("section").style.display="block";//显示
                document.getElementById("section2Cs").style.display="none";//隐藏
                document.getElementById("section2").style.display="block";//显示
                }
                </script>
<p>
    <img th:src="@{${logoUrl}}" width="36" height="36"/>
</p>
<div id="header">
</div>
<div id="section" >
    <a>No longer have access to Vivien Home</a>
</div>
<div id="sectionCs">
        <a>Už nemají přístup k Vivien Home</a>
    </div>
<div id="section2">
    <p>
        You will no longer have access to Vivien Home since she/he remove the share.
    </p>
</div>
<div id="section2Cs">
    <p>
        Již nebudete mít přístup k domácnosti Vivien Home, protože bylo zrušeno sdílení.
    </p>
</div>
</body>

但是效果图却没有隐藏，英语文案，还报错了

Uncaught TypeError: Cannot read property 'style' of null at error.html:84

我就很纳闷，花了两个小时百度，Google，最后发现了，说是先执行的script，html还没渲染所以style肯定为空，将script移到html代码下面就可以了

<body>
<p>
    <img th:src="@{${logoUrl}}" width="36" height="36"/>
</p>
<div id="header">
</div>
<div id="section" >
    <a>No longer have access to Vivien Home</a>
</div>
<div id="sectionCs">
        <a>Už nemají přístup k Vivien Home</a>
    </div>
<div id="section2">
    <p>
        You will no longer have access to Vivien Home since she/he remove the share.
    </p>
</div>
<div id="section2Cs">
    <p>
        Již nebudete mít přístup k domácnosti Vivien Home, protože bylo zrušeno sdílení.
    </p>
</div>
<script>
        var JsSrc =(navigator.language || navigator.browserLanguage).toLowerCase();
        var sbtitle=document.getElementById("section");
        console.log("weichongbin JsSrc : ",JsSrc," sbtitle.style : " ,sbtitle.style);
        if(JsSrc.indexOf('cs')>=0)
        {
        // 假如浏览器语言是捷克语
        document.getElementById("section").style.display="none";//隐藏
        document.getElementById("sectionCs").style.display="block";//显示
        document.getElementById("section2").style.display="none";//隐藏
        document.getElementById("section2Cs").style.display="block";//显示
        }
        else
        {
        // 假如浏览器语言是其它语言
        document.getElementById("sectionCs").style.display="none";//隐藏
        document.getElementById("section").style.display="block";//显示
        document.getElementById("section2Cs").style.display="none";//隐藏
        document.getElementById("section2").style.display="block";//显示
        }
        </script>
</body>