Question

我有一个“内部”div元素，我想从java脚本控制。现在，loaded（）函数中的代码没有做任何事情。

这是scc和javascript部分

    <style>
#outer {    

    width: 30px;
    height: 80px;
    border: 2px solid #ccc;
    overflow: hidden;

    position: relative;

    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;

}

#inner, #inner div {
    width: 100%;
    overflow: hidden;
    left: -2px;
    position: absolute;
}

#inner {
    border: 2px solid #999;
    border-top-width: 0;
    background-color: blue;

    bottom: 0;
    height: 30%;
}

#inner div {
    border: 1px blue;
    border-bottom-width: 0;
    background-color: blue;

    top: 0;
    width: 100%;
    height: 2px;
}

</style> 
<script>


  function loaded(){
         document.getElementById("inner").setAttribute("height","100%");

  }      

</script>

这是身体部位

<body onload = "loaded()">
<div id="outer">
              <div id="inner">
                <div></div>
              </div>
            </div>
</body>

现在，我可以在＃inner中手动更改百分比，现在它是30％。我想这可能是我对divs理解的好运。

Answer 1

var myDiv = document.getElementById("inner");
myDiv.style.height = "40%";

Answer 2

你很亲密。 height不是div元素的属性，但是style是，而height是style的属性。试试这个：

function loaded(){
     document.getElementById("inner").style.setAttribute("height","100%");
}

从javascript更改div元素的属性

2 个答案: