我有這樣的HTML。刪除圖像中的空白
<td id="foo">
<img src="foo.png" /> <img src="foo.png" /> <img src="foo.png" />
</td>
上面的HTML包含空格,也
,
我想刪除使用jQuery。
如何做到這一點?
已經試過用這個腳本但沒有工作。
$('#foo').text().replace(/ /g,'');
我有這樣的HTML。刪除圖像中的空白
<td id="foo">
<img src="foo.png" /> <img src="foo.png" /> <img src="foo.png" />
</td>
上面的HTML包含空格,也
,
我想刪除使用jQuery。
如何做到這一點?
已經試過用這個腳本但沒有工作。
$('#foo').text().replace(/ /g,'');
我認爲你需要使用內容(),然後過濾掉所有textNodes這是一個簡單的空間
var nodes = $("#foo").contents().filter(function() {
return this.nodeType == 3 && /^(\s| )*$/.test(this.nodeValue);
}).remove();
//console.log($("#foo").html());
類似的東西可能?如果你只得到了圖像,那麼你可以只取出&& this.data == " "
部分
我已經編輯它看起來對空間和 現在的jsfiddle測試:http://jsfiddle.net/Rurn2/
您試過這個:$('#foo').html($('#foo').html().replace(/ /g,''));
?您的代碼將根據元素中的文本返回一個空白字符串。但是如果你想覆蓋元素的文本,你必須在大括號之間輸入新的字符串。
不能正常工作,已經測試過了 – GusDeCooL 2012-04-11 07:39:34
您無法刪除所有來自innerHTML的空白,因爲這將從HTML標籤內刪除空白。 – jfriend00 2012-04-11 07:54:47
咬,忘了那個空白:D ...傻。我建議在這裏使用其他匹配html實體的答案,或者創建一個臨時元素('document.createElement'),用html填充它,以便將實體轉換爲空格,並使用解析的字符串。它將需要更多的代碼,但它(通常來說)是解碼/編碼html實體的更安全的方法。如果你想要的是' ',所提供的答案jfriend00將工作得很好,但 – 2012-04-11 08:09:28
試試這個:
var html = '>' + $('#foo').html() + '<';
html = html.replace(/ /g, '').replace(/>\s+</gm, '><');
$('#foo').html(html.substring(1, html.length-1));
最安全的方法是找到所有文本節點,並將它們的nodeValue與您正在查找的內容進行比較,並刪除僅包含空格的節點值。直接對innerHTML進行操作充滿了困難,因爲您必須確保您不會搞亂實際標籤內的東西(例如應該存在的空白)。在文本節點上操作僅使用瀏覽器來保證您的安全。你可以找到符合您的條件像這樣的所有文本節點:
$("#foo").contents().filter(function() {
if (this.nodeType == 3) {
return(this.nodeValue.replace(/\s| /g, "") == "");
}
return(false);
}).remove();
你可以看到它在這裏工作:http://jsfiddle.net/jfriend00/RNTbT/
FYI,這個版本甚至會處理那些空格和
的組合文本節點。它通過刪除所有空格和
然後看看是否還有剩下的東西。如果不是,那麼它是一個只有空白的文本節點,所以它應該被刪除。
可能的dup http://stackoverflow.com/questions/1539367/remove-whitespace-and-line-breaks-between-html-elements-using-jquery – elclanrs 2012-04-11 07:37:26