Làm cách nào để thêm khoảng cách giữa 2 từ trong JavaScript?


Giãn cách văn bản

Trong chương này, bạn sẽ tìm hiểu về các thuộc tính sau

  • text-indent
  • letter-spacing
  • line-height
  • word-spacing
  • white-space

Thuộc tính text-indent được sử dụng để chỉ định thụt lề cho dòng đầu tiên của văn bản


Khoảng cách chữ cái

Thuộc tính letter-spacing được sử dụng để chỉ định khoảng cách giữa các ký tự trong văn bản

Ví dụ sau minh họa cách tăng hoặc giảm khoảng cách giữa các ký tự


Chiều cao giữa các dòng

Thuộc tính line-height được sử dụng để chỉ định khoảng cách giữa các dòng



Giãn cách từ

Thuộc tính word-spacing được sử dụng để xác định khoảng cách giữa các từ trong văn bản

Ví dụ sau minh họa cách tăng hoặc giảm khoảng cách giữa các từ


khoảng trắng

Thuộc tính white-space chỉ định cách xử lý khoảng trắng bên trong một phần tử

Ví dụ này minh họa cách tắt gói văn bản bên trong một phần tử


Thuộc tính khoảng cách văn bản CSS

Thuộc tínhMô tảletter-spacingChỉ định khoảng cách giữa các ký tự trong textline-heightChỉ định chiều cao của dòngtext-indentChỉ định khoảng cách thụt đầu dòng của dòng đầu tiên trong khối văn bảnwhite-spaceChỉ định cách xử lý khoảng trắng bên trong một phần tửword-spacingChỉ định khoảng cách giữa các từ trong văn bản

ValueDes mô tảDemonormalXác định khoảng cách bình thường giữa các từ (0. 25em). Đây là defaultDemo ❯lengthXác định khoảng trắng bổ sung giữa các từ (bằng px, pt, cm, em, v.v.). Cho phép giá trị âm. Đọc về đơn vị độ dàiDemo ❯initialĐặt thuộc tính này thành giá trị mặc định. Đọc về khởi tạo Kế thừa thuộc tính này từ phần tử cha của nó. Đọc về thừa kế

“replace()” là một phương thức được xác định trước của đối tượng kiểu Chuỗi được sử dụng để thay thế giá trị trong một chuỗi bằng chuỗi, ký tự hoặc ký hiệu đã xác định. Nó trả về một chuỗi mới dưới dạng đầu ra với các giá trị được thay thế sau khi tìm kiếm chuỗi cho một giá trị cụ thể hoặc mẫu biểu thức chính quy

cú pháp

Thực hiện theo cú pháp được cung cấp bên dưới để sử dụng phương thức thay thế ()

chuỗi. thay thế("searchValue" , "replaceValue")

Phương thức replace() chấp nhận hai tham số, một là “searchValue” sẽ được tìm kiếm và thay thế, và một là “replaceValue” được sử dụng làm giá trị thay thế

Thí dụ

Trong ví dụ này, đầu tiên, chúng ta sẽ tạo một biến có tên là “string” lưu trữ một chuỗi có thêm khoảng trắng

var string = "Chào mừng bạn đến với LinuxHint";

Sau đó, tạo một mẫu biểu thức chính quy và lưu trữ nó trong một biến có tên là “regexPattern”

var regexPattern = / \s +/<g;

Ở đây, “\s” được sử dụng cho các khoảng trắng, dấu “+” biểu thị tất cả các khoảng trắng trong một chuỗi và “g” là cờ chung được thêm vào để tìm kiếm toàn bộ chuỗi và xác định khoảng trắng

Bây giờ, hãy gọi phương thức “replace()” bằng cách chuyển mẫu biểu thức chính quy dưới dạng giá trị tìm kiếm và khoảng trắng dưới dạng giá trị thay thế

var ans = chuỗi. thay thế( regexPattern, " ");

Ở đây, mẫu sẽ tìm kiếm khoảng trắng giữa các từ và thay thế chúng bằng một khoảng trắng

Cuối cùng, in chuỗi kết quả trên bảng điều khiển bằng cách sử dụng lệnh “console. phương thức log()”

bảng điều khiển. log( ans );

Như bạn có thể thấy rằng đầu ra đưa ra một chuỗi có một khoảng trắng giữa các từ

Làm cách nào để thêm khoảng cách giữa 2 từ trong JavaScript?

Nếu bạn muốn xóa tất cả khoảng trắng giữa các từ, hãy sử dụng phương pháp bên dưới

Phương pháp 2. Loại bỏ khoảng trắng thừa giữa các từ bằng phương pháp split()

Để xóa khoảng trắng thừa giữa các từ, hãy sử dụng phương thức JavaScript “split()” với phương thức “join()”. Phương thức split() chia chuỗi thành một mảng các chuỗi con, trong khi phương thức join() nối các chuỗi con và xuất ra một chuỗi mới. Phương thức split() nhận một tham số cần được thay thế và phương thức join() nhận tham số thay thế làm đối số của nó

Phương thức này tìm các khoảng trắng trong chuỗi và thay thế tất cả các khoảng trắng bằng chuỗi rỗng

cú pháp

Làm theo cú pháp dưới đây để sử dụng phương thức split()

chuỗi. tách(" ") . tham gia("")

Ở đây, phương thức split() tách chuỗi dựa trên khoảng trắng và nối chúng với một chuỗi rỗng

Thí dụ

Bây giờ chúng ta sẽ sử dụng cùng một chuỗi đã được tạo trong ví dụ trên và gọi phương thức “split()” với phương thức “join()”

var ans = chuỗi. tách(" ") . tham gia("")

Cuối cùng, in chuỗi kết quả trên bảng điều khiển bằng lệnh “console. phương thức log()”

bảng điều khiển. log( ans );

Đầu ra cho thấy rằng tất cả các khoảng trắng giữa chuỗi đã được xóa thành công

Làm cách nào để thêm khoảng cách giữa 2 từ trong JavaScript?

Nếu bạn muốn xóa các khoảng trắng xuất hiện ở đầu chuỗi, bạn phải làm theo phần đã cho

Phương pháp 3. Loại bỏ khoảng trắng thừa giữa các từ bằng phương pháp trim()

Phương thức “trim()” là một phương thức JavaScript khác được sử dụng để xóa khoảng trắng. Nó có thể loại bỏ các khoảng trắng ở vị trí bắt đầu và kết thúc của chuỗi và đưa ra một chuỗi mới được cắt bớt. Nó không chỉ xóa khoảng trắng mà còn xóa tab và ngắt dòng khỏi chuỗi. Phương thức này không chấp nhận bất kỳ tham số nào làm đối số

cú pháp

Thực hiện theo cú pháp được đề cập bên dưới để xóa khoảng trắng thừa giữa các từ

chuỗi. cắt();

Thí dụ

Ở đây, chúng ta sẽ tạo một chuỗi có thêm khoảng trắng ở đầu và lưu trữ nó trong một biến có tên là “string”

var string = " Chào mừng bạn đến với LinuxHint";

Sau đó, gọi phương thức “trim()” sẽ xóa các khoảng trắng ở đầu chuỗi

var ans = chuỗi. cắt();

In chuỗi kết quả trên bàn điều khiển

bảng điều khiển. log( ans );

Các khoảng trắng từ đầu chuỗi được xóa thành công

Làm cách nào để thêm khoảng cách giữa 2 từ trong JavaScript?

Chúng tôi đã biên soạn tất cả các quy trình để loại bỏ khoảng cách thừa giữa các từ

Phần kết luận

Để xóa các khoảng trắng thừa, bạn có thể sử dụng các phương thức JavaScript được xác định trước, bao gồm phương thức replace(), phương thức split() hoặc phương thức trim(). Phương thức trim() xóa khoảng trắng ở đầu chuỗi, trong khi phương thức replace() xóa khoảng trắng thừa giữa các từ. Phương thức split() loại bỏ tất cả khoảng cách giữa các từ. Hướng dẫn này minh họa quy trình loại bỏ khoảng cách thừa giữa các từ với các giải thích chi tiết

Làm cách nào để tạo khoảng cách giữa 2 từ trong JavaScript?

Trong JavaScript, chúng tôi sử dụng Thuộc tính khoảng cách từ để đặt khoảng cách giữa các từ trong văn bản hiển thị trên trang web.

Làm cách nào để thêm không gian trong JavaScript nối?

Chỉ cần thêm khoảng trắng vào concat . Tôi thích sử dụng ' ' hơn để tạo khoảng trống.