Làm cách nào để chuyển sang dòng tiếp theo trong javascript?

Question

Trong bài viết này, chúng tôi sẽ thảo luận về cách chia mã javascript thành nhiều dòng. Chúng tôi thường chia mã thành nhiều dòng để người thứ ba hoặc chính lập trình viên có thể đọc được dễ dàng

Nội dung chính Show

Phá Chuỗi Sử dụng Escape Sequence
Thí dụ. 1
Ví dụ. 2
Dòng mới sử dụng chữ mẫu
Thí dụ. 1
Ví dụ. 2
Phần tử ngắt HTML
Thí dụ. 1
Ví dụ. 2
Mối quan tâm về khả năng tiếp cận
Thuộc tính
Tạo kiểu với CSS

Có hai cách để chia mã JavaScript thành nhiều dòng

Chúng ta có thể sử dụng ký tự thoát dòng mới i. e “\n”. nếu chúng tôi đang làm việc trên tệp js hoặc không hiển thị mã cho trang html
We can use the
tag. if we are working on the html file.
Chúng tôi có thể tùy chọn các trình định dạng mã như đẹp hơn có thể được sử dụng cho các mục đích như vậy. chia mã JavaScript thành nhiều dòng là một quá trình giúp giảm độ vụng về của mã, Đôi khi chúng ta viết những dòng mã dài khiến nó khó đọc

Cách tiếp cận 1. Sử dụng ký tự xuống dòng

HTML

<html>

<head>

<121>

6_______16_______>

9

<<2>

<<6>

<8<9

html0_______12_______1

html2______12_______3

html4html5

html4

6<6>

6_______11_______2>

6_______12_______>

đầu ra

Làm cách nào để chuyển sang dòng tiếp theo trong javascript?

Approach 2: Using the
tag.

HTML

<html>

9

<head>

<121>

6_______16_______>

9

<<2>

<<6>

9

html2_______16_______5

html2_______16_______7head8head9

html2_______13_______1head8>3

9

html2____18_______0

6<6>

6_______11_______2>

9

6_______12_______>

Output: The lines got separated into two after using the
tag.

Cách tiếp cận 3. Sử dụng tiện ích đẹp hơn

Trong VSCode sau khi cài đặt plugin đẹp hơn, chúng ta có thể thay đổi định dạng mặc định thành đẹp hơn. sau khi thay đổi nó thành trình định dạng mặc định, một tệp đẹp hơn có phần mở rộng. prettierrc phải được tạo và mã bên dưới phải được viết

{
  "printWidth": 50
}

Thuộc tính chiều rộng in đặt độ dài của dòng mà máy in sẽ quấn trên đó.

Ví dụ

Trước khi sử dụng đẹp hơn

Sau khi sử dụng đẹp hơn. Có thể thấy rõ rằng các dòng được định dạng theo độ rộng tối đa được cung cấp (giá trị chúng tôi cung cấp cho printWidth). chiều rộng in là 50 cho mã bên dưới

Chúng ta có thể gặp nhiều trường hợp phải tạo một dòng mới bằng JavaScript. Nghe có vẻ phức tạp, nhưng trên thực tế, những cách tiếp cận này khá đơn giản và có thể thực hiện dễ dàng. Có nhiều cách khác để chèn dòng mới bằng JavaScript. Chúng ta hãy xem những cách phổ biến nhất để tạo dòng mới bằng JavaScript

Phá Chuỗi Sử dụng Escape Sequence

Trình tự thoát được sử dụng để tạo một dòng mới là \n. Trong khi hiển thị một số văn bản trên bảng điều khiển JavaScript, bạn có thể thêm một dòng mới bằng cách sử dụng ký hiệu \n, viết tắt của một dòng mới. Chúng ta có thể thêm \n với chuỗi mà chúng ta muốn ngắt dòng. Hãy xem một ví dụ về cách \n hoạt động

Thí dụ. 1

Trong ví dụ này, chúng tôi sẽ tạo một chuỗi mà chúng tôi muốn ngắt. Và sẽ in nó trong bảng điều khiển


var string = "Hi \nThis is the Second line \nThis is the third line";

console.log(string)
đầu ra
Hi 
This is the Second line 
This is the third line
Ví dụ. 2
Chúng tôi cũng có thể sử dụng \n Trình tự thoát với cú pháp chữ mẫu và có thể nhận được kết quả tương tự
var v = `1 \n2 \n3 \n4`;
console.log(v);
đầu ra
Dòng mới sử dụng chữ mẫu
Để tạo một dòng mới trong bảng điều khiển, bạn cũng có thể chèn dấu ngắt dòng mới bằng cách nhấn Enter trong khi sử dụng chữ mẫu. Chúng ta hãy xem một ví dụ tương tự
Thí dụ. 1
Ở đây chúng tôi đang làm theo cú pháp chữ mẫu để Làm cho phương pháp của chúng tôi khả thi
var string = `Hi
This is the Second line 
This is the third line`;

console.log(string)

đầu ra
Hi 
This is the Second line 
This is the third line
Ví dụ. 2
Chúng tôi cũng có thể sử dụng kết hợp nhập và \n trong cú pháp chữ mẫu
var v = `1
2
3\n4`;
console.log(v)

đầu ra
Phần tử ngắt HTML
Nếu chúng tôi chỉ muốn thêm một dòng mới vào Trang web bằng JavaScript, thì việc Thêm các phần tử ngắt dòng HTML vào chuỗi của bạn có thể thực hiện công việc cho bạn. Bằng cách sử dụng phần tử ngắt trong chuỗi, chúng ta phải sử dụng thuộc tính innerHTML để hiển thị chuỗi dưới dạng HTML chứ không phải văn bản
Thí dụ. 1
Trong ví dụ này, chúng tôi đang sử dụng thẻ br để chuyển sang một dòng mới, cách tiếp cận này phản ánh những thay đổi trong HTML của trang
 
 
	 
	 
 


đầu ra
________số 8_______Ví dụ. 2
Chúng ta cũng có thể sử dụng cú pháp chữ mẫu với biến JavaScript và kết quả sẽ giống nhau
 
 
	 
	 
 

đầu ra
Mối quan tâm về khả năng tiếp cận
Tạo ngắt dòng hoặc tách đoạn bằng cách sử dụng
là một thực hành xấu. Đó cũng là một khó khăn đối với những người sử dụng các công cụ đọc màn hình để điều hướng. Sự hiện diện của
phần tử có thể được chỉ định bởi trình đọc màn hình, điều này có thể gây nhầm lẫn cho người dùng và được gọi là không phải là một phương pháp hay

yếu tố sau
Thuộc tính
Các thuộc tính của phần tử ngắt bao gồm các thuộc tính toàn cục
Tạo kiểu với CSS
Phần tử Break phục vụ một chức năng duy nhất, nó tạo ngắt dòng trong một đoạn văn bản. Vì vậy, bạn có thể làm rất ít để tạo kiểu ngắt dòng. Bạn chỉ có thể thêm một số lề để phá vỡ các phần tử để tăng hoặc giảm khoảng cách giữa các dòng

programming javascript

Làm cách nào để chuyển sang dòng tiếp theo trong javascript?

HTML

HTML

Phá Chuỗi Sử dụng Escape Sequence

Thí dụ. 1

Ví dụ. 2

Dòng mới sử dụng chữ mẫu

Thí dụ. 1

Ví dụ. 2

Phần tử ngắt HTML

Thí dụ. 1

Ví dụ. 2

Mối quan tâm về khả năng tiếp cận

Thuộc tính

Tạo kiểu với CSS

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội