如何用我们自己的标签替换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 ：

 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（通常这是一个要求，但可能很难依靠用户输入），因此您将需要在其中提供一些良好的，用户友好的错误处理。