displayプロパティ

条件に応じてHTMLの要素を、出したり消したりしたいときはdisplayプロパティが使えます。

JavaScriptを用いてdisplayプロパティの値をのnoneにしてあげれば、その要素は表示されなくなります。

以下は例です。

// HTML
<input id="text" type="text"  value="" maxlength="30" style="30%:;ime-mode:active" />
<input name="button" class="button" type="button" value="入力" onclick="elementDisplay()">

<tr id="foo" style="display: ;">
何か入力してください
</tr>
<tr id="bar" style="display: none;">
</tr>

// JavaScript

function elementDisplay(){
  var foo = document.getElementById('foo');
  var bar = document.getElementById('bar');
  var text = null;
  text = document.getElementById('text');


  if(text.value == "") {
    foo.style.display = '';
    bar.style.display = 'none';
  } else {
    foo.style.display = 'none';
    bar.style.display = '';
    bar.innerHTML = '「' + text.value + '」が入力されました。';
  }
}