JSFiddle - React, Tailwind, and code Playground
by Casufi
HTML
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>База определений</title>
</head>
<body>
<table>
<colgroup>
<col align="right" />
<col />
<col align="center" />
</colgroup>
<thead>
<tr>
<td>Команда</td>
<td>Описание</td>
<th>Реализация</th>
</tr>
</thead>
<tbody>
<tr>
<th>git status</th>
<td>Выводит список добавленных файлов в репозитории</td>
<th>Реализовывается</th>
</tr>
<tr>
<th>git diff</th>
<td>Показать различия в файлах, которые не были инсценированы</td>
<td>Не реализовывается</td>
</tr>
</tbody>
</table>
<div class="markdown-data">
<header>
<strong>Данные в формате Markdown</strong>
</header>
<main>
</main>
</div>
</body>
</html>
JavaScript
window.onload = function() {
solution();
};
function solution() {
console.log("markdown-data", document.getElementsByClassName("markdown-data"));
const div = document.getElementsByClassName("markdown-data")[0].childNodes[1]; //Получаем доступ к контейнеру, куда будем вставлять сформированную Markdown-разметку
const table = document.getElementsByTagName("table"); //Откуда мы будем брать исходные данные таблицы для полноценной конвертации HTML в Markdown.
const source = [
[
['left', 'right', 'center'],
[]
],
[
[':---', '---:', ':---:'],
[]
]
];
let input; //Здесь будет вывод сконвертированных данных.
div.innerHTML = input;
const columnsGroup = () => {
const tabledata = table.childNodes[0];
const columnsdata = tabledata.getElementsByTagName("col");
let convert;
for (let ci = 0; ci < columnsdata.length; ci++) {
if (columnsdata[ci].hasAttribute("align")) {
const colalignres = [columnsdata[ci].getAttribute("align"), source[0][0], source[1][0]];
for (let cdi = 0; cdi < colalignres[1].length; index++) {
if (colalignres[0] == colalignres[1][cdi]) {
convert += "| " + colalignres[1][cdi] + " ";
break;
}
}
} else {
convert += "| " + colalignres[1][2] + " ";
}
}
return convert + "\n";
};
const tableHeader = () => {
const tabledata = table.children[1];
};
const tableContent = () => {
const tabledata = table.children[2];
};
input += tableHeader; //Записывает шапку таблицы
input += columnsGroup; //Записывает метаданные настройки колонок
input += tableContent; //И затем содержимое таблицы и Markdown готов;-)
}