特殊字符中断从HTML字符串创建jQuery DOM

Question

我正在使用jQuery从输入文本字段中删除不需要的html标记。这工作得很好，但是，当一个特殊字符输入为HTML实体，如™（这是我想要让）我在飞行DOM创建过程中得到以下错误：

语法错误，无法识别的表达式： .. ™

想法是从文本字段中获取html字符串;从中创建一个DOM元素;然后，只删除不需要的标签。

像这样的数据：<span>My <b>company</b></span>被清理到My <b>company</b> ...我期望。

但是输入的数据，如：My <b>company</b> &trade;休息

var s = jQuery(this).find('#new-topic').val(); 
 
var $s = jQuery(s); //this is where the error occurs 
 
var $elements = $s.find("*").not("b, strong"); //get elements that are not <b> or <strong> 
 

 
for (var i = $elements.length - 1; i >= 0; i--) { 
 
    var e = $elements[i]; 
 
    jQuery(e).replaceWith(e.innerHTML); 
 
} 
 

 
var finalInput = $s.html();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="new-topic" type="text">

反正是有允许在这种情况下，特殊字符？

Answer 1

该问题实际上是由于从文本字段中捕获的字符串没有包裹在标签中导致的;例如：My <b>company</b> &trade;但是<span>My <b>company</b> &trade;</span>确实有效。当没有将标签输入到文本字段中时，这也会造成一些不良行为，例如：My company。为了解决这个我只是一直包裹在字符串中的一个标记之前创建的DOM元素：s = '<test>'+s+'</test>';

jQuery('#remove-unwanted-tags').on('click', function() { 
 
    var s = jQuery('#new-topic').val(); 
 
    console.log('Before removing unwanted tags: ' + s); 
 
    s = '<test>' + s + '</test>'; //added fix 
 
    var $s = jQuery(s); //this is where the error occurs 
 
    var $elements = $s.find("*").not("b, strong"); //get elements that are not <b> or <strong> 
 
    
 
    for (var i = $elements.length - 1; i >= 0; i--) { 
 
     var e = $elements[i]; 
 
     jQuery(e).replaceWith(e.innerHTML); 
 
    } 
 
    
 
    var finalInput = $s.html(); 
 
    console.log('After removing unwanted tags: ' + finalInput); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="new-topic" type="text"> 
 
<input type="button" id="remove-unwanted-tags" value="remove unwanted tags">

不知道这是去约财产清理不需要的标签，但在最好的办法至少它工作。