【HTML】處理換行符追加到前端換行無效的問題 --- html中渲染的字符串中包含HTML標簽無效的處理方法，字符串中包含HTML標簽被轉義的問題 解決

 

需求如下圖：

 

 

 

追加給前台后，效果如下：

 

 

可以在源碼看到：

 

 

 是將后台給出來的數據，直接當作字符串給填充在了前台HTML中。

而查看瀏覽器編譯后的HTML源碼可以發現：

 

 

 

原來字符串中的<br> 的<>符號已經被轉義

 

 

 

 

實際是想將渲染出來的字符串中的<br>換行符可以生效。

 

 

 

 

處理方式：

var tbody = $(".J_listtable_cont").find("tbody").children();
            for (let i = 0; i <tbody.length ; i++) {
                var children = tbody[i];
                var td = children.children[1];
                var text = td.innerText; td.innerHTML = text;
            }

 

核心就是上面標紅的兩句，將元素的innerText  賦值成  元素的 innerHTML。即可避免轉義的問題，將字符串中包含的 HTML標簽生效。

 

 

最后的效果如下：