JQuery：多個選擇器，只做其中的一個

我通過循環兩個選擇：

$('.div').each(function() { 
    $('.selector1, .selector2 option:selected').text(); 
}

兩個選擇返回純文本，我需要在頁面順序輸出。

我的問題是，無論何時.selector2（下拉列表中的值），我都需要在它周圍添加一個標記< span>。我該怎麼做，同時保持訂單？

來源

2010-07-07 HelpMe

是否有你的理由使用'each（）'循環針對（推測）一個元素？由於'＃div'是一個ID，應該只有其中一個。即使如此，您的選擇器*內的'.each（）'正在搜索整個頁面。 – user113716 2010-07-07 12:35:00

每個選擇器都不是唯一的。創建簡化示例時出錯。現在改變了:)謝謝 – HelpMe 2010-07-07 12:49:11

text()返回沒有標記的純文本。您不應該將其視爲HTML，正如您暗示的那樣，「添加<span>」。否則，文本中的<和&字符將成爲標記，具有潛在的安全隱患。切勿混淆純文本和HTML標記。

如果你必須拋出關於HTML字符串，你可以使用html()代替：

var html= $('.selector1, .selector2 option:selected').map(function() { 
    if ($(this).is('.selector1')) 
     return $(this).html(); 
    else 
     return '<span>'+$(this).html()+'</span>'; 
}).get().join('');

但我寧願使用DOM的方法：

target= $('#place-to-put-content'); 
$('.selector1, .selector2').each(function() { 
    if ($(this).is('.selector1')) 
     $target.append(document.createTextNode($(this).text())); 
    else 
     target.append($('<span>', {text: $(this).val()})); 
});

來源

2010-07-07 12:42:17 bobince

非常感謝。創建示例時，text（）是一個錯誤。我當然使用HTML（），因爲它是HTML我創建:) 關於解決方案2：它會更好地附加在結束而不是在循環？性能明智... – HelpMe 2010-07-07 12:59:42

它不會有任何區別，因爲每個DOM節點都以一種一個一個的方式插入到文檔中。使用'append（）'插入一段HTML也會發生同樣的情況。只有當你可以一次性編寫一個對象的*整個*'html（）'時，你才能獲得任何加速（甚至在有些情況下你不會這樣做，因爲jQuery的處理試圖隱藏錯誤）。在任何情況下，除非在單個父項中有*數百個* .selector1，.selector2'元素，否則無關緊要。 – bobince 2010-07-07 13:05:49

只是你的優秀解決方案的一個快速更新，你錯過.get（）在第一個解決方案之前加入（） – HelpMe 2010-07-07 14:43:55

您需要使用wrap函數。

.wrap（wrappingElement）

wrappingElementAn HTML代碼段，選擇器表達式，jQuery對象，或 DOM元素指定結構環繞匹配的元素。

.wrap（wrappingFunction）

wrappingFunctionA回調函數，其生成環繞匹配元素的結構。

來源

2010-07-07 12:17:01 galambalazs

JQuery：多個選擇器，只做其中的一個

回答

相關問題