10

基本的に、押すと現在の body div タグが非表示になり、その場所に別のタグが表示されるリンクを作成しようとしていますが、残念ながら、リンクをクリックすると、最初の body div タグがまだ表示されます。HTMLコードは次のとおりです。

<div id="body">
    <h1>Numbers</h1>
</div>
<div id="body1">
    Body 1
</div>

CSSコードは次のとおりです。

#body {
    height: 500px;
    width: 100%;
    margin: auto auto;
    border: solid medium thick;
}

#body1 {
    height: 500px;
    width: 100%;
    margin: auto auto;
    border: solid medium thick;
    display: hidden;
}

JavaScript コードは次のとおりです。

function changeDiv() {
  document.getElementById('body').style.display = "hidden"; // hide body div tag
  document.getElementById('body1').style.display = "block"; // show body1 div tag
  document.getElementById('body1').innerHTML = "If you can see this, JavaScript function worked"; // display text if JavaScript worked
}

注意: CSS タグは別のファイルで宣言されています

4

7 に答える 7

33

やってみました

document.getElementById('body').style.display = "none";

それ以外の

document.getElementById('body').style.display = "hidden";?

于 2013-03-06T23:50:18.333 に答える
9

jquery event listner を使用して、イベントをクリックしてください。リンクのクラスをlbにしましょう...あなたが言ったように、ボディをdivと考えています...

$('.lb').click(function() {
    $('#body1').show();
    $('#body').hide();
 });
于 2013-10-20T14:04:05.157 に答える
1

の使用を検討してくださいjQuery。生活はより簡単になります:

$('body').hide(); $('body1').show();
于 2013-03-06T23:54:26.327 に答える