Формат <a>тег на уценку - PullRequest
0 голосов
/ 22 апреля 2020

У меня есть задача, где мне нужно отформатировать div данные из html следующим образом:

<div>
<h4>Some Title</h4>
<p><a href="somelink.com"><strong>Bold and then</strong> normal</a></p>
<p><a href="somelink2.com">Just normal</a></p>
</div>

Для этого:

#### Some Title
[**Bold and then** normal](somelink.com)  //two spaces after <a> tag for line breaks
[Just normal](somelink2.com)

У меня есть функция, которая заменяет все Теги <strong> и <em>, но я не знаю, что делать с тегами <a> в моем случае.

const toMarkdown = (text) => {
      let one = text.replace(/<em>/g,'*').replace(/<\/em>/g,'*');
      let two = one.replace(/<strong>/g,'**').replace(/<\/strong>/g,'**');
      return two
    }

const html = `<div>
<h4>Some Title</h4>
<p><a href="somelink.com"><strong>Bold and then</strong> normal</a></p>
<p><a href="somelink2.com">Just normal</a></p>
</div>`

const toMarkdown = (text) => {
  let one = text.replace(/<em>/g, '*').replace(/<\/em>/g, '*');
  let two = one.replace(/<strong>/g, '**').replace(/<\/strong>/g, '**');
  return two
}

console.log(toMarkdown(html))

1 Ответ

1 голос
/ 22 апреля 2020

Я бы сделал это

const html = `<div><h4>Some Title</h4>
<p><a href="somelink.com"><strong>Bold and then</strong> normal</a> <em>bold</em></p>
<p><a href="somelink2.com">Just normal</a></p>
</div>`

const toMarkdown = (text) => {
  let obj = document.createElement("div");
  obj.innerHTML = text;
  [...obj.querySelectorAll("strong, em")].forEach(ele => ele.parentNode.replaceChild(document.createTextNode("*"+ele.textContent+"*"),ele));
  [...obj.querySelectorAll("a")].forEach(ele => ele.parentNode.replaceChild(document.createTextNode("["+ele.textContent+"]("+ele.href+")"),ele));
  [...obj.querySelectorAll("h4")].forEach(ele => ele.parentNode.replaceChild(document.createTextNode("####"+ele.textContent),ele));
  [...obj.querySelectorAll("p")].forEach(ele => ele.parentNode.replaceChild(document.createTextNode(ele.textContent),ele)); // ignore?
  [...obj.querySelectorAll("div")].forEach(ele => ele.parentNode.replaceChild(document.createTextNode(ele.textContent),ele));  
  
  return obj
}

console.log(toMarkdown(html).innerHTML)
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...