如何用我们自己的标签替换 html 标签

Question

在我的 MVC web 应用程序中，我在 View 中有一个文本区域，用户将在该文本中放置 HTML 文本，因此我想用我自己的自定义标签替换 html 标签.

例如：

HTML 标签：

<input type='text' name='MyList.First_Name' data-val='true' data-val-required='Please enter first name' />

替换为：

[~TextFieldTag|MyList.First_Name|||0|data-val=>true|data-val-required=>Please enter first name|~]

谁能建议最好的方法是什么？

Answer 1

起初我打算推荐一个简单的字符串替换，但考虑到替换的看似复杂的性质，这可能不是最好的方法。

可能最好的方法是采用 HTML，将其转换为 DOM 元素，只需将其放入元素 innerHTML:[=13 即可完成=]

document.querySelector('button').addEventListener('click', () => {
  document.querySelector('#renderSpace').innerHTML = document.querySelector('textarea').value;
});

Add some HTML:
<textarea></textarea>
<button>Press Me</button>
<div id="renderSpace"></div>

您可以将渲染区域定位在屏幕外，这样用户就不会真正看到它。

从那里开始，我会遍历 DOM 树（基本上，从根开始，然后递归地查看它的所有子项，然后是它们的子项，等等），读取您认为的任何属性认为合适，然后在进行时编写字符串替换。

这确实需要他们输入有效的 HTML（这通常是一项要求，但很难依赖用户输入），因此您需要一些好的、用户友好的, 那里的错误处理。

如何用我们自己的标签替换 html 标签

How to replace html tags with our own tags

javascript

jquery

html

asp.net-mvc-5.1