jQuery以某種方式添加空格輸出

我想創建一個腳本來動態創建錨標記和鏈接到一個特定的元素。但是，當我輸出錨文本時，它會在散列和文本之間添加一堆空格。jQuery以某種方式添加空格輸出

$(document).ready(function(){ 
     $('.accordion h2').each(function(){ 
     var thisText = $(this).text(); 
     var anchorText = thisText.replace(/ /g, "-"); 
     var anchorLink = '<a name="' + anchorText + '"></a>'; 
     var anchorTextFull = '<a href="#' + anchorText + '">' + thisText + '</a>'; 
     $(this).before(anchorLink); 
     $(this).after(anchorTextFull); 
    }); 
});

此代碼輸出anchorTextFull變量如下：

<a href="#  foo-bar">Foo Bar</a>

在哪裏這些空間是從哪裏來的？

感謝

來源

2011-05-16 Ben Shoults

jQuery的包括裝飾的功能，可以使用在一個字符串的開頭或結尾，以除去多餘的空白：

var thisText = $.trim($(this).text());

來源

2011-05-16 17:41:23

精美的合作，謝謝！ – 2011-05-16 17:52:39

這些可能是從$(this).text()到來。這些可以是h2標籤中的新行字符。做一個alert("'" + $(this).text() + "'")確認。

來源

2011-05-16 17:29:15

這個問題實際上是由HTML表現不同，然後JQuery的造成的。在HTML中，空格和多餘的行不重要。

<div id="vendor">Barracuda</div>

和

<div id="vendor"> 
    Barracuda 
</div>

然而，當你使用jQuery的。文本（）方法，它們產生不同的結果：

在HTML中，當呈現頁面這兩個例子是視覺上相同。

<div id="vendor">Barracuda</div> 

$('#vendor').text() // equals "Barracuda"

但是，這是很大的不同：

<div id="vendor"> 
    Barracuda 
</div> 

$('#vendor').text() // equals "   Barracuda   "

因此需要.trim（）的結果，如果你不能定製HTML，或只是想發揮它的安全。

var thisText = $.trim($(this).text());

JSFiddle Working Example

來源

2012-05-15 18:09:24

jQuery以某種方式添加空格輸出

回答

相關問題