Таблица до сих пор превосходит все попытки её имитировать по очень простой причине:
если скопировать её из браузера, она спокойно вставится в Excel или Google Sheets как нормальный диапазон.
Но вот обратное направление не работает. Скопировал диапазон из Sheets — а в браузере всё рассыпалось в текст, будто ничего и не было.
Иногда это мешает: есть форма с табличкой на сайте, есть данные в Google Sheets, и единственное желание — просто вставить их туда, не перепечатывая по ячейке. Чтобы привычный Ctrl+V вёл себя так же естественно, как в Excel.
Для таких случаев можно сделать маленькую, но удобную вещь — ловить событие вставки и парсить табличные данные из буфера, распределяя их по нужным полям:
document.addEventListener("paste", function (e) {
const text = e.clipboardData.getData("text");
const rows = text.trim().split(/\r?\n/).map(r => r.split("\t"));
const inputs = [...document.querySelectorAll("input")];
let index = 0;
for (const row of rows) {
for (const cell of row) {
if (inputs[index]) {
inputs[index].value = cell;
index++;
}
}
}
e.preventDefault();
});
Так можно взять диапазон в Google Sheets, нажать Ctrl+V в браузере — и данные разложатся по ячейкам формы, словно это штатная функция.
Я пример забыл, а вы и молчите: https://codepen.io/alinaki/pen/KwzvEeX
#js #table #бородач