отображение таблицы html с javascript

Пожалуйста, новичок в программировании, мне очень нужна ваша помощь в этом. Как я могу скрыть таблицу HTML, а затем отобразить ее с помощью кнопки using.JavaScript?отображение таблицы html с javascript

источник

2016-05-05 Imran

Возможный дубликат [javascript hide/show element] (http://stackoverflow.com/questions/6242976/javascript-hide-show-element) – Aaronepower

Используйте document.querySelector, чтобы получить элементы и атрибут hidden, чтобы показать и скрыть таблицу. Использование слушателя событий и слушать для click события на кнопку:

var table = document.querySelector("table"); 
 
table.hidden = true; 
 

 
document.querySelector("button").addEventListener("click", function(event) { 
 
    table.hidden = false; 
 
});

table { 
 
    text-align: center; 
 
    border-collapse: collapse; 
 
} 
 
td, 
 
th { 
 
    padding: 0 5px; 
 
    border: 1px solid black; 
 
}

<table> 
 
    <tr> 
 
    <th>Day</th> 
 
    <th>Rain</th> 
 
    </tr> 
 
    <tr> 
 
    <td>1</td> 
 
    <td>50 mm</td> 
 
    </tr> 
 
    <tr> 
 
    <td>2</td> 
 
    <td>21 mm</td> 
 
    </tr> 
 
    <tr> 
 
    <td>3</td> 
 
    <td>5 mm</td> 
 
    </tr> 
 
</table> 
 
<button>Show</button>

источник

2016-05-05 20:23:15 metarmask

Вы можете использовать библиотеку под названием JQuery, чтобы сделать это очень легко.

В вашем <head>, положить <script src="code.jquery.com/jquery-latest.js></script>
Дайте <table> идентификатор, например: <table id="myTable">
Добавьте одну кнопку, как это: <button onclick="$('#myTable').hide();">Hide</button>
И другой, как это: <button onclick="$('#myTable').show();">Show</button>

Это позволит вам переключать видимость таблицы.

Я начал писать это перед опубликованием @metarmask - его/ее ответ намного лучше, поэтому вы, вероятно, должны принять его/ее совет.

источник

2016-05-05 21:55:13 Orisun

отображение таблицы html с javascript

ответ

Смежные вопросы