我v-html用來取消轉義 Html 標簽但我只想取消轉義<a></a>字串中的標簽。舉個例子
輸入:
<p> Hello World </p> <a target="_blank" href="https://www.google.com/">https://www.google.com/</a> <div></div>
輸出:鏈接處于活動狀態,但所有其他標簽應為純文本
<p> Hello World </p> https://www.google.com/ <div></div>
如何在 Vue 中只取消鏈接標簽并保留其他標簽?
uj5u.com熱心網友回復:
這是最容易使用正則運算式替換所有<and>和除了標簽周圍<的那些時代之一><a>
new Vue({
el: "#app",
data: () => ({
input: `<p> Hello World </p> <a target="_blank" href="https://www.google.com/">https://www.google.com/</a> <div></div>`
}),
computed: {
output: ({ input }) => input
.replace(/<(?!\/?a( |>))/g, "<")
.replace(/(?<=<[^>] )>/g, ">")
}
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
<div id="app">
<div v-html="output"></div>
<pre>output = {{ output }}</pre>
</div>
兩個替補是
- 替換任何
<不屬于<a>或</a>不屬于< >將現在前面的任何內容替換<為>
請注意,lookbehind 斷言目前在任何版本的 Safari 中都不起作用。
uj5u.com熱心網友回復:
HTML 具有您可以使用的轉義標簽:
<(<)>(>)
使用這些知識,您可以輕松解決您的問題。
<p>你好世界</p> https://www.google.com/ <div></div>
=
<p >Hello World </p >https://www.google.com/ <div > </div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/houduan/444696.html
標籤:javascript html Vue.js 逃跑
上一篇:盡管它適用于先前加載的svg,但沒有事件適用于加載的svg路徑
下一篇:將布林值傳遞給v-for回圈
