TypeError：无法读取属性'css'为null [英] TypeError: cannot read property 'css' of null

问题描述

我试图通过引用它的类名来设置我的div元素的最小高度，但它回来一个错误： TypeError：不能读取属性'css'null 。

HTML元素：

 < div class =container contentContainerid =topContainer> 
< div class =row> 
< div class =col-md-6 col-md-offset-3id =topRow> 
< p class =bold>请向下滚动以了解更多信息< / p> 
< / div> 
< / div> 
< / div> 
  

Javascript ：

 <！ -  jQuery（Bootstrap的JavaScript插件必需） - > 
< script src =https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js>< / script> 
<！ - 包含所有编译的插件（如下），或根据需要包含单独的文件 - > 
< script src =js / bootstrap.min.js>< / script> 
 
< script> 
 $（function（）{
 var x = document.getElementsByClassName（contentContainer）; 
 alert（x）; 
 if（x！= null）
 {
 $（。contentContainer）。css（'min-height'，$（window）.height（））; 
} 
} 
< / script> 
  

有关我为什么会收到此错误的任何建议？

当我包含我的外部javascript文件时会出现问题：

 <！ - < script type =text / javascriptsrc =js / monthly.js>< / script> - > 
  

解决方案

您正在加载jQuery和Bootstrap它们都破坏了 $ 符号;只使用jQuery你将使用规范名称：

  jQuery（。contentContainer）
 .css min-height'，jQuery（window）.height（））; 
  

或者使用包装器：

  jQuery（function（$）{
 $（。contentContainer）css（'min-height'，$（window）.height（））; 
 }）; 
  

I am trying to set the minimum-height of my div element by referring to its class name but it comes back with an error: TypeError: cannot read property 'css' of null.

HTML element:

<div class="container contentContainer" id="topContainer">
        <div class="row">
            <div class="col-md-6 col-md-offset-3" id="topRow">
                <p class="bold">Please scroll down for more information </p>
            </div>
        </div>
    </div>

Javascript:

<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<!-- Include all compiled plugins (below), or include individual files as needed -->
<script src="js/bootstrap.min.js"></script>

<script>
    $(function () {
        var x = document.getElementsByClassName("contentContainer");
        alert(x);
        if(x != null)
        {
            $(".contentContainer").css('min-height',$(window).height());
        }
    });
</script>

Any suggestions as to why am I getting this error? Kindly let me know.

The problem occurs when I include my external javascript file:

<!-- <script type="text/javascript" src="js/monthly.js"></script> -->

解决方案

You're loading jQuery and Bootstrap at the same time and they both clobber the $ symbol; to use only jQuery you would use the canonical name:

jQuery(".contentContainer")
    .css('min-height', jQuery(window).height());

Or, use a wrapper:

jQuery(function($) {
    $(".contentContainer").css('min-height',$(window).height());
});

这篇关于TypeError：无法读取属性'css'为null的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！