<a>将标签格式化为 Markdown</a>

Question

我有一个任务，我需要像这样格式化来自 html 的div数据：

<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)

我有 function 替换所有<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))

Answer 1

我会这样做

 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)