วิธีการลบช่องว่างนำหน้าและต่อท้ายออกจากสตริง html ที่ระบุได้อย่างไร

178

ฉันเป็นสตริง HTML ต่อไปนี้ อะไรคือรหัสตัวอย่างใน JavaScript เพื่อลบช่องว่างนำหน้าและต่อท้ายจากสตริงนี้

<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

— นิล
แหล่งที่มา

ตรวจสอบนี้

— musefan

ปัญหาที่แท้จริงของคุณคืออะไร? คุณต้องการลบช่องว่างก่อนที่จะแทรกโหนดในเอกสารหรือไม่

— Rob W

ฉันต้องการลบช่องว่างสีขาวชั้นนำทั้งหมดรวมถึงช่องว่างสีขาวต่อท้ายทั้งหมด ฉันชอบวิธีการตัดใน C # ยกเว้นว่ามันจะลบช่องว่างสีขาว

— Sun

ดังนั้นในตัวอย่างของฉันในที่สุดฉันก็ควรได้รับสิ่งต่อไปนี้หลังจากการตัดแต่ง: การตัดโดยใช้ JavaScript <br /> <br /> <br /> <br /> ช่องว่างสีขาวนำหน้าและต่อท้าย

— Sunil

@Sunil ฉันไม่ทราบว่าคุณเคยแก้ไขปัญหานี้หรือไม่ แต่คุณสามารถลองใช้วิธีแก้ไขปัญหาเหล่านี้อย่างใดอย่างหนึ่งได้: stackoverflow.com/questions/16708158/…

— Chris Baker

245

ดูวิธี String 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);

แก้ไข

ตามที่ระบุไว้ในความคิดเห็นอื่น ๆ มันเป็นไปได้ที่จะใช้วิธีการ regex trimวิธีการได้อย่างมีประสิทธิภาพเพียงนามแฝงสำหรับ regex ที่ใช้งาน:

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

... สิ่งนี้จะแทรกวิธีในต้นแบบดั้งเดิมสำหรับเบราว์เซอร์เหล่านั้นที่ยังคงว่ายน้ำในปลายตื้นของสระ

— Chris Baker
แหล่งที่มา

3

ฉันต้องการวิธี regex เพราะมันไม่ได้รับการสนับสนุนในทุกเบราว์เซอร์ ( ไอแก้ไอ IE <9)

— PeeHaa

2

วิธีการตัดแต่งจะไม่ตัดแต่งช่องว่างสีขาว แต่มีเพียงช่องว่าง ดังนั้นมันไม่ใช่สิ่งที่ฉันกำลังมองหา

— นิล

8

ฉันไม่แน่ใจว่าคุณคิดว่า "ช่องว่างสีขาว" คืออะไร แต่การตัดแต่งจะลบช่องว่างออกโดยทั่วไป (ขึ้นบรรทัดใหม่เว้นวรรคแท็บ ฯลฯ ) ไม่ใช่แค่อักขระเว้นวรรค

— bsa

2

@bsa ฉันเข้าใจว่าเขาหมายถึง "พื้นที่สีขาว" ในแง่ของภาพในขณะที่ "พื้นที่ว่างทางสายตาในผลลัพธ์ของการเรนเดอร์ HTML" จากนั้นเขาเพิ่มความคิดเห็นข้างบน "ยกเว้นบรรทัดใหม่ที่เกิดจากbrแท็ก"

— Chris Baker

2

เหตุใดจึงไม่มีเครื่องหมายถูกในคำตอบที่มี 170 upvotes บางครั้งฉันก็สับสน

— tcoulson

63

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

สำหรับเบราว์เซอร์เก่าให้ใช้ regex

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

— Jhankar Mahbub
แหล่งที่มา

2

"[]" เหมือนกันทุกประการ "" การจัดกลุ่มตัวละครของตัวละครหนึ่งตัวนั้นก็คือ .. เอ่อ ... ตัวละครตัวเดียว

— Flimzy

2

@Flimzy: ใช่มันจะทำให้รู้สึกมากขึ้นในการเขียน[\t\n\ ]หรือเพียงแค่\sแทน[ ]ซึ่งทำให้รู้สึกไม่

— erik

11

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

— Sandeep Manne
แหล่งที่มา

อ่านคำถามที่ ใช้แทนช่องว่างธรรมดา ด้านบนของสิ่งนี้ช่องว่างที่อยู่ภายในแท็ก

— Rob W

6

หากคุณทำงานกับสตริงหลายบรรทัดเช่นไฟล์รหัส:

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

และต้องการแทนที่บรรทัดนำทั้งหมดเพื่อรับผลลัพธ์นี้:

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

คุณต้องเพิ่มการmultilineตั้งค่าสถานะใน regex ของคุณ^และ$จับคู่ทีละบรรทัด:

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

ข้อความที่เกี่ยวข้องจากเอกสาร :

แฟล็ก "m" บ่งชี้ว่าสตริงอินพุตหลายบรรทัดควรถูกใช้เป็นหลายบรรทัด ตัวอย่างเช่นหากใช้ "m" การเปลี่ยนแปลง "^" และ "$" จากการจับคู่ที่จุดเริ่มต้นหรือจุดสิ้นสุดของสตริงทั้งหมดเป็นการเริ่มต้นหรือสิ้นสุดของบรรทัดใด ๆ ภายในสตริง

— ไจโกเมซ
แหล่งที่มา

4

ฉันรู้ว่านี่เป็นคำถามที่เก่ามาก แต่ก็ยังไม่มีคำตอบที่ยอมรับได้ ฉันเห็นว่าคุณต้องการลบสิ่งต่อไปนี้: แท็ก html ที่เป็น "ช่องว่าง" และช่องว่างสีขาวตามสตริง html

ฉันคิดวิธีแก้ไขตามความคิดเห็นของคุณสำหรับผลลัพธ์ที่คุณต้องการ:

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, ""));

ขยายตัวอย่างข้อมูล

.trim() ลบช่องว่างนำหน้าและต่อท้าย

.replace(/ /g, '') ลบ  

.replace(/<[^\/>][^>]*><\/[^>]+>/g, "")); ลบแท็กที่ว่างเปล่า

— แอนโทนี่
แหล่งที่มา

3

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

— SenorAmor
แหล่งที่มา

1

มันจะลบช่องว่างสีขาวเช่น <br /> หรือ <p> & nbsp; & nbsp; </p> <div> & nbsp; </div> หรือไม่ Trmming ช่องว่างที่เรียบง่ายไม่เป็นปัญหา มันเป็นการลบพื้นที่สีขาวที่ฉันเป็นหลังจากนั้น

— นิล

จะลบพื้นที่สีขาวหรือไม่

— user2086641

3

01) หากคุณต้องการลบเฉพาะพื้นที่สีขาวชั้นนำและต่อท้ายให้ใช้สิ่งนี้:

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

นี่จะส่งคืนสตริง "No.255 Colombo"

02) หากคุณต้องการลบพื้นที่สีขาวทั้งหมดให้ใช้สิ่งนี้:

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

สิ่งนี้จะส่งคืนสตริง "No.255Colombo"

— Chamila Maddumage
แหล่งที่มา