鍍金池/ 問答/HTML/ 如何處理模板字符串中的html標(biāo)簽

如何處理模板字符串中的html標(biāo)簽

頁(yè)面中有個(gè)input輸入框，如果對(duì)方輸入<h2>你好</h2>,那么會(huì)自動(dòng)轉(zhuǎn)變成大號(hào)粗體的文字。
如何達(dá)到p.content中直接輸出字符串，h2標(biāo)簽不解析成大號(hào)粗體？

var value = document.getElementById('input').value;
template = `
<p class="content">${value}</p>
`;

上述代碼會(huì)將HTML標(biāo)簽解析成默認(rèn)的樣式，模板字符串中如何達(dá)到和textContent或者innerText一樣的效果？

回答
編輯回答
凝雅

僅僅是消除標(biāo)簽的樣式的話，把標(biāo)簽過濾就行了吧，還用不上富文本插件：

const filterHTMLTag =(msg) => {
    let msg = msg.replace(/<\/?[^>]*>/g, ''); //去除HTML Tag
    msg = msg.replace(/[|]*\n/, '') //去除行尾空格
    msg = msg.replace(/&npsp;/ig, ''); //去掉npsp
    return msg;
}

代碼來自度娘 -，-

2018年7月22日 20:33
編輯回答
逗婦乳

傳送門:html 標(biāo)簽轉(zhuǎn)譯反轉(zhuǎn)譯，http://www.cnblogs.com/xiansh...

2018年1月6日 21:00
編輯回答
魚梓

你說的這個(gè)input標(biāo)簽滿足不了你，你去找富文本js插件吧，像百度ueditor

2017年2月18日 20:50
編輯回答
玄鳥

去找富文本插件

2017年11月15日 21:15
編輯回答
陌離殤

把字符串中標(biāo)簽的開始和結(jié)尾轉(zhuǎn)義以下就好了：

function htmlEscape(text) {
    return text.replace(/[<>"&]/g, function(match, pos, originalText){
        switch(match) {
            case "<": {
                return "&lt";
            }
            case ">": {
                return "&gt";
            }
            case "&": {
                return "&amp";
            }
            case "\"": {
                return "&quot;";
            }
        }
    });
}

這些函數(shù)還是經(jīng)常用到的，可以創(chuàng)建一個(gè)自己的代碼倉(cāng)庫(kù)，把常用的函數(shù)存起來。

2018年3月14日 10:03