Question

Javascript：无法读取 Else 上为 null 的属性“style”

2014-06-27

31086

javascript jquery html

错误消息：无法读取 null 的属性“style”出现在我的“else”语句的第一个语句中。不确定我哪里出错了。有什么想法吗？

$(document).ready(function () {
    var foursquareApi = {
        clientId: "CLIENT_ID",
        clientSecret: "CLIENT_SECRET",
        redirectUrl: "http://almontas.github.io/FourSquareJax/"
    }

    if (access_token === 0) {

        document.getElementById('dashboardProfile').style.display == 'none';
        document.getElementById('dashboardInfo').style.display == 'none';

        $('.connect').click(function () {

            var url = "https://foursquare.com/oauth2/access_token";
            url += "?client_id=" + foursquareApi.clientId;
            url += "&response_type=token";
            url += "&redirect_uri=" + foursquareApi.redirectUrl;
            window.location = url;

        });
    } else {
        document.getElementById('dashboardProfile').style.display == 'block'; //this lines gives an error message. 
        document.getElementById('dashboardInfo').style.display == 'block';
    }

以下是一些有问题的 HTML。.dashboardProfile 和 .dashboardInfo 似乎已到位，如评论所述。

<body>
        <div class="container">
          <div class="header">
            <div class="logo"><img src = "images/foursquare-logo.png"> 
            </div> 


       </div>

            <div class="dashboard-container">


            <div class="dashboardConnect">
                <div class="connect"><p> Sign In </p>
                </div>

           </div>

                <div class="dashboardProfile">
                    <p>User Information and Picture</p>     
                </div>

                <div class="dashboardInfo">
                    <p>Check Ins </p>   
                    <div class="indicator checkin"> # </div>

                    <p>Countries</p>   
                    <div class="indicator country"> # </div>

                    <p>Cities</p>   
                    <div class="indicator city"> # </div>


                </div>

           </div>   

    </div><!--container-fluid-->

Answer 1

您没有 ID 为 dashboardProfile 的元素，但有一个类为 dashboardProfile 的元素。

因此，您这样做：

document.getElementsByClassName('dashboardProfile')[0].style.display = "none"

您的其他 document.getElementById 也是如此，您的 HTML 中没有任何带 ID 的元素。

Answer 2

您可以使用 jquery 这样做，这样更简单

$('.dashboardProfile').css("display","block"); $('.dashboardInfo').css("display","block");

Answer 3

如果不存在，则无法访问 dashboardProfile 的属性 style 。通过以下方式检查其是否存在：

if ( document.getElementById('dashboardProfile') !== null ) {
     document.getElementById('dashboardProfile').style.display = 'block';
}

此外，要分配值，请使用 = ；要进行比较，请使用 == 或 === 。