Javascript 标记语言解析器

如何解决Javascript 标记语言解析器

我正在尝试使用 Javascript 构建自定义标记语言解析器。

例如：-

• **bold** ==> 粗体

• __italics__ ==> 斜体

为了显示解析的文本，我试图用 html 标签，并将它们传递给 label 的 innerHTML。

• **bold** ==> <b>bold</b>

我的第一种方法是只使用 replace 函数，但这并不理想，因为它只能替换开始标记，而不能替换结束标记。

然后我用JS regex找到了一个临时解决方案，

const bold = /\*\*([A-z0-9]+)\*\*/gi
const italics = /\_\_([A-z0-9]+)\_\_/gi

const updateTextMessage = () => {
    let text = $('#textParser').val()
    text = text.replace(bold,'<b>$1</b>')
    text = text.replace(italics,'<i>$1</i>')
    $('#parsedText').html(text)
}

body{
display: flex;
flex-direction: column;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span id="parsedText">Parsed text will appear here</span>
 <textarea id="textParser" oninput="updateTextMessage()" type="text" placeholder="Type Here"></textarea>

但是这段代码的问题是当我在中间给出一个句子时，它不起作用；

**This sentence should be bold** ==> 这句话要加粗

这不起作用。

我知道是正则表达式不允许这种情况发生，而且我也知道有关正则表达式的工作，即 /\*\*(.*)\*\*/gim

但这也会转换不需要的情况。

例如，我不希望这些是有效的语法。

** hello**

** hello,this a sentence**

（区别在于特殊字符和文本之间的分离。这有点类似于 WhatsApp 标记文本的工作方式。）

如何用正则表达式解决这个问题？我也对其他方法感兴趣。

解决方法

你非常接近！您只需要进行一些更改，以确保双 * 或 _ 字符附近的第一个字母不是空格。

const bold = /\*{2}([A-Z0-9][A-Z0-9\s]+[A-Z0-9])\*{2}/gi 这分为：

1. 检查两个 *
2. 检查第一个字符是否为字母数字。
3. 检查是否有一系列字母数字或空格字符。
4. 检查后面是否有字母数字。
5. 最后，检查是否以两个 * 结尾。

const bold = /\*{2}([A-Za-z0-9][A-Za-z0-9\s]+[A-Za-z0-9])\*{2}/gi
const italics = /_{2}([A-Za-z0-9][A-Za-z0-9\s]+[A-Za-z0-9])_{2}/gi

const updateTextMessage = () => {
  let text = $('#textParser').val()
  text = text.replace(bold,'<b>$1</b>')
  text = text.replace(italics,'<i>$1</i>')
  $('#parsedText').html(text)
};

body {
  display: flex;
  flex-direction: column;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span id="parsedText">Parsed text will appear here</span>
<textarea id="textParser" oninput="updateTextMessage()" type="text" placeholder="Type Here"></textarea>