Làm cách nào để xóa các khoảng trắng hàng đầu và dấu kiểm khỏi một chuỗi html đã cho?

177

Tôi có chuỗi HTML sau. Điều gì sẽ là mã mẫu trong JavaScript để xóa các khoảng trắng hàng đầu và dấu kiểm khỏi chuỗi này?

<p>&nbsp;&nbsp;</p>
<div>&nbsp;</div>
Trimming using JavaScript<br />
<br />
<br />
<br />
all leading and trailing white spaces
<p>&nbsp;&nbsp;</p>
<div>&nbsp;</div>

javascript removing-whitespace

— Mặt trời
nguồn

kiểm tra cái này

— musefan

Vấn đề thực sự của bạn là gì? Bạn có muốn xóa khoảng trắng trước khi chèn các nút trong tài liệu không?

— Rob W

Tôi muốn loại bỏ tất cả các khoảng trắng hàng đầu cũng như tất cả các khoảng trắng ở cuối. Rất giống phương thức Trim của tôi trong C # ngoại trừ việc nó loại bỏ các khoảng trắng.

— Sunil

Vì vậy, trong ví dụ của tôi, cuối cùng tôi cũng sẽ nhận được những điều sau đây sau khi cắt tỉa: Cắt tỉa bằng cách sử dụng JavaScript <br /> <br /> <br /> <br /> tất cả các khoảng trắng hàng đầu và dấu vết

— Sunil

@Sunil Tôi không biết bạn đã từng giải quyết vấn đề này chưa, nhưng bạn có thể thử một trong những giải pháp sau: stackoverflow.com/questions/16708158/ Kẻ

— Chris Baker

244

Xem phương thức Chuỗi trim()- https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/String/Trim

var myString = '  bunch    of <br> string data with<p>trailing</p> and leading space   ';
myString = myString.trim();
// or myString = String.trim(myString);

Biên tập

Như đã lưu ý trong các ý kiến khác, có thể sử dụng phương pháp regex. Các trimphương pháp là có hiệu quả chỉ là một bí danh cho một regex:

if(!String.prototype.trim) {  
  String.prototype.trim = function () {  
    return this.replace(/^\s+|\s+$/g,'');  
  };  
}

... điều này sẽ đưa phương thức vào nguyên mẫu gốc cho những trình duyệt vẫn đang bơi ở đầu cạn của bể bơi.

— Chris Baker
nguồn

3

Tôi thích cách regex hơn, vì nó không được hỗ trợ trong tất cả các trình duyệt ( ho IE <9).

— PeeHaa

2

Phương pháp cắt sẽ không cắt các khoảng trắng, mà chỉ các khoảng trắng. Vì vậy, nó không phải là những gì tôi đang tìm kiếm.

— Sunil

8

Tôi không chắc bạn nghĩ "khoảng trắng" là gì, nhưng trim sẽ loại bỏ khoảng trắng nói chung (dòng mới, dấu cách, tab, v.v.), không chỉ là ký tự khoảng trắng.

— bsa

2

@bsa Tôi đã hiểu anh ấy có nghĩa là "khoảng trắng" theo nghĩa trực quan, như trong "các khu vực trống trực quan trong kết quả hiển thị HTML", và sau đó anh ấy đã thêm vào một nhận xét ở trên "ngoại trừ dòng mới do brthẻ gây ra ".

— Chris Baker

2

Tại sao không có dấu kiểm trên một câu trả lời với 170 upvote? SO đôi khi làm tôi bối rối.

— tcoulson

63

var str = "  my awesome string   "
str.trim();

đối với các trình duyệt cũ, hãy sử dụng regex

str = str.replace(/^[ ]+|[ ]+$/g,'')
//str = "my awesome string"

— Jhankar Mahbub
nguồn

2

"[]" hoàn toàn giống với "". Một nhóm nhân vật gồm chính xác một nhân vật là .. à ... chính xác là một nhân vật.

— Flimzy

2

@Flimzy: Vâng, nó sẽ có ý nghĩa hơn để viết [\t\n\ ]hoặc chỉ \sthay vì [ ]nó không có ý nghĩa.

— erik

11

string.replace(/^\s+|\s+$/g, "");

— Sandeep Manne
nguồn

Đọc câu hỏi,  được sử dụng thay vì một khoảng trắng thông thường. Trên hết, khoảng trắng được chứa trong một thẻ.

— Rob W

6

Nếu bạn đang làm việc với một chuỗi nhiều dòng, như tệp mã:

<html>
    <title>test</title>
    <body>
        <h1>test</h1>
    </body>
</html>

Và muốn thay thế tất cả các dòng hàng đầu, để có được kết quả này:

<html>
<title>test</title>
<body>
<h1>test</h1>
</body>
</html>

Bạn phải thêm multilinecờ vào biểu thức chính quy của mình ^và $khớp từng dòng:

string.replace(/^\s+|\s+$/gm, '');

Trích dẫn có liên quan từ các tài liệu :

Cờ "m" chỉ ra rằng một chuỗi đầu vào đa dòng nên được coi là nhiều dòng. Ví dụ: nếu "m" được sử dụng, "^" và "$" thay đổi từ khớp chỉ ở đầu hoặc cuối của toàn bộ chuỗi thành bắt đầu hoặc kết thúc của bất kỳ dòng nào trong chuỗi.

— Jaime Gómez
nguồn

4

Tôi biết đây là một câu hỏi rất cũ nhưng nó vẫn không có câu trả lời được chấp nhận. Tôi thấy rằng bạn muốn xóa các thẻ sau: thẻ html "trống" và khoảng trắng dựa trên chuỗi html.

Tôi đã đưa ra một giải pháp dựa trên nhận xét của bạn cho đầu ra mà bạn đang tìm kiếm:

Trimming using JavaScript<br /><br /><br /><br />all leading and trailing white spaces

var str = "<p>&nbsp;&nbsp;</p><div>&nbsp;</div>Trimming using JavaScript<br /><br /><br /><br />all leading and trailing white spaces<p>&nbsp;&nbsp;</p><div>&nbsp;</div>";
console.log(str.trim().replace(/&nbsp;/g, '').replace(/<[^\/>][^>]*><\/[^>]+>/g, ""));

Mở rộng đoạn trích

.trim() loại bỏ khoảng trắng hàng đầu và dấu

.replace(/ /g, '') loại bỏ  

.replace(/<[^\/>][^>]*><\/[^>]+>/g, "")); xóa các thẻ trống

— Anthony
nguồn

3

var trim = your_string.replace(/^\s+|\s+$/g, '');

— SenorAmor
nguồn

1

Nó sẽ xóa các khoảng trắng như <br /> hoặc <p> & nbsp; & nbsp; </ p> <div> & nbsp; </ div>? Trmming không gian đơn giản không phải là một vấn đề. Đó là loại bỏ khoảng trắng mà tôi đang theo đuổi.

— Sunil

nó sẽ xóa khoảng trắng

— user2086641

3

01). Nếu bạn cần loại bỏ chỉ khoảng trắng hàng đầu và dấu, hãy sử dụng:

var address = "  No.255 Colombo  "
address.replace(/^[ ]+|[ ]+$/g,'');

điều này sẽ trả về chuỗi "No.255 Colombo"

02). Nếu bạn cần loại bỏ tất cả các khoảng trắng, hãy sử dụng:

var address = "  No.255 Colombo  "
address.replace(/\s/g,"");

điều này sẽ trả về chuỗi "No.255Colombo"

— Chamila Maddumage
nguồn