0

divの関係についての理解が不足しているのではないかと思いますか？

最終的に、目標は、「要素」divを青い「親」divの上にスライドさせることです。

現在の焦点は、単に表示することです（displayは元々「none」に設定されていました）。

なぜこれが機能しないのかわかりません...

  <style type="text/css">
#parent {
    height: 100px;
    width: 100px;
    background-color: blue;
}

#element {
    height: 50px;
    width: 50px;
    background-color: red;
    display: none;
}
</style>

  <body>
<div id="element"></div>
    <div id="parent" onclick="peekDown('element');"> </div>
  </body>


<script type="text/javascript">
//<![CDATA[
function peekDown(id) {
    var element = document.getElementById(id);
    element.style.display = "";
    console.log(element.style.display);
}
//]]>
</script>
4

2 に答える 2

2

他にエラーがないと仮定すると、次のようになります。

function peekDown(id) {
    var element = document.getElementById(id);
    element.style.display = "";
    console.log(element.style.display);
}

whileelement.style.display = '';は属性でdisplay見つかったプロパティの設定を解除しますが、スタイルシートで設定されているプロパティの設定を解除したり、影響を与えたりしないため、機能しません。styledisplay

したがって、明示的に使用する必要がありますdisplay = 'block';:

function peekDown(id) {
    var element = document.getElementById(id);
    element.style.display = "block";
    console.log(element.style.display);
}

代わりに、要素のclassName順序をdisplay要素に変更できます。

function peekDown(id) {
    var element = document.getElementById(id);
    element.className = "newClass";
    console.log(element.style.display);
}

そのための明示的なCSS宣言に依存しています.newClass:

.newClass {
    display: block;
}
于 2012-06-10T22:48:57.547 に答える
0

.style.displayプロパティを設定して、そのプロパティ""のインラインスタイルを削除し（コードにインラインスタイルがない）、スタイルシートのルールを適用できるようにします。

.className代わりにプロパティを変更し、スタイルシートに#element {}と#element.someDescriptiveClass {}を含めます。

于 2012-06-10T22:47:40.483 に答える