Khi nào nên sử dụng Internalhtml?

Nó được sử dụng chủ yếu trong các trang web để tạo html động như biểu mẫu đăng ký, biểu mẫu nhận xét, liên kết, v.v.

Ví dụ về thuộc tính InternalHTML

Trong ví dụ này, chúng ta sẽ tạo biểu mẫu html khi người dùng nhấp vào nút

Trong ví dụ này, chúng tôi đang viết động biểu mẫu html bên trong tên div có id mylocation. Chúng tôi đang xác định vị trí này bằng cách gọi tài liệu. phương thức getElementById()

Khi bạn nhận hoặc thiết lập một phần tử trong JavaScript, bạn có rất nhiều tùy chọn — nhiều tùy chọn trong số đó có vẻ giống hệt nhau

Trong bài đăng này, tôi sẽ phân tích những khác biệt tinh tế giữa

const getValue = document.getElementById('blog-test');

1,

const getValue = document.getElementById('blog-test');

2 và

const getValue = document.getElementById('blog-test');

3 khi bạn thao tác với mã JavaScript của mình

Điều gì là tốt nhất. Nội văn so với. Bên trongHTML so với. Nội dung văn bản?

• NộiHTML. Sử dụng InternalHTML cho phép bạn xem chính xác những gì trong phần đánh dấu HTML chứa trong một chuỗi, bao gồm các yếu tố như khoảng cách, ngắt dòng và định dạng.  
• Văn bản bên trong. Điều này gần đúng với nội dung văn bản "kết xuất" của một nút và biết về kiểu dáng và CSS. Nó hiệu quả nhất khi bạn chỉ cần xem có gì trong phần tử mà không cần định dạng
• Nội dung văn bản. Điều này truy xuất và đặt nội dung của thẻ dưới dạng văn bản thuần túy. Nó hiệu quả nhất khi bạn muốn xem có gì trong một phần tử, cộng với kiểu dáng

Hãy bắt đầu với một số mã HTML mẫu mà tôi sẽ sử dụng để minh họa cách hoạt động của từng thuộc tính

   
This element is strong and     has some super fun code!

Như bạn có thể thấy trong đoạn mã trên, chúng tôi đang thêm một số HTML để làm cho từ

const getValue = document.getElementById('blog-test');

0 (đậm) và làm cho từ _______11 xuất hiện đơn cách nhau. Trình duyệt sẽ hiển thị mã như thế này

Đoạn mã trên hiển thị gì trong trình duyệt. . Ảnh chụp màn hình. Annie Mester

Giả sử chúng ta đang tạo một biến

const getValue = document.getElementById('blog-test');

2 và đặt nó bằng với biến

const getValue = document.getElementById('blog-test');

3 của chúng ta

const getValue = document.getElementById('blog-test');

Bây giờ, tôi sẽ giải thích những gì bạn nhận được khi gọi

const getValue = document.getElementById('blog-test');

1,

const getValue = document.getElementById('blog-test');

5 và

const getValue = document.getElementById('blog-test');

3 trên biến

const getValue = document.getElementById('blog-test');

2 đó

 

InternalHTML trong JavaScript là gì?

________số 8

 

InnerHTML trả về cái gì?

InnerHTML trả về chuỗi bên trong mã đánh dấu

const getValue = document.getElementById('blog-test');

3 và HTML (hoặc XML) có trong chuỗi của chúng tôi, bao gồm mọi khoảng cách, ngắt dòng và bất thường về định dạng

 

Khi nào nên sử dụng InternalHTML

Bạn nên sử dụng

const getValue = document.getElementById('blog-test');

1 khi muốn xem đánh dấu HTML và chính xác những gì có trong phần tử của bạn — bao gồm mọi khoảng cách, ngắt dòng và bất thường về định dạng

 

Ghi chú bổ sung của InternalHTML

If the text inside the element includes the characters

getValue.innerHTML

// =>   This element is strong and     has some super fun code!

0,

getValue.innerHTML

// =>   This element is strong and     has some super fun code!

1, or

getValue.innerHTML

// =>   This element is strong and     has some super fun code!

2,

const getValue = document.getElementById('blog-test');

1 will return these characters as HTML entities “&”, “<” and “>”.

Thông tin thêm về JavaScript Cách chọn giữa vòng lặp For và vòng lặp While

 

Nội dung trong JavaScript là gì?

const getValue = document.getElementById('blog-test');

3

 

Nội dung nào trả về

InnerText trả về chuỗi bên trong

const getValue = document.getElementById('blog-test');

3 của chúng tôi. Nó xấp xỉ nội dung văn bản “kết xuất” của một nút và biết về kiểu dáng và CSS

Nghĩ theo cách này. Nếu người dùng đánh dấu nội dung của một thành phần trên màn hình của họ và sao chép nó vào khay nhớ tạm của họ, thì những gì bạn nhận được với

const getValue = document.getElementById('blog-test');

2 chính xác là những gì nó sẽ trả về

 

Khi nào nên sử dụng InnerText

Bạn nên sử dụng

const getValue = document.getElementById('blog-test');

2 khi bạn chỉ cần xem nội dung trong phần tử mà không cần định dạng

 

Nội dung ghi chú bổ sung

Khi sử dụng 

const getValue = document.getElementById('blog-test');

2 nó sẽ truy xuất và đặt nội dung của thẻ ở dạng văn bản thuần túy. Trong khi khi bạn sử dụng

const getValue = document.getElementById('blog-test');

1, nó sẽ truy xuất và đặt cùng một nội dung ở định dạng HTML

 

TextContent trong JavaScript là gì?

const getValue = document.getElementById('blog-test');

5

 

Nội dung văn bản nào trả về

TextContent trả về nội dung của tất cả các phần tử trong nút, bao gồm các phần tử script và style. Nó nhận thức được định dạng như khoảng cách và ngắt dòng và cũng sẽ trả về những định dạng đó

 

Khi nào nên sử dụng TextContent

Bạn nên sử dụng

const getValue = document.getElementById('blog-test');

3 bạn muốn xem phần tử có gì, cộng với bất kỳ kiểu dáng nào

 

Nội dung văn bản Ghi chú bổ sung

Mặc dù 

const getValue = document.getElementById('blog-test');

2 rất giống với

const getValue = document.getElementById('blog-test');

3, nhưng có những điểm khác biệt quan trọng giữa chúng. Nói một cách đơn giản,

const getValue = document.getElementById('blog-test');

2 nhận thức được hình thức hiển thị của văn bản trong khi

const getValue = document.getElementById('blog-test');

3 thì không

Nâng cao kỹ năng của bạn 4 cách giúp nhà phát triển phần mềm xây dựng kỹ năng của họ

 

Nội văn so với. Bên trongHTML so với. Nội dung văn bản

Hãy xem lại mã ban đầu của chúng tôi

const getValue = document.getElementById('blog-test');

6

Đây là những gì

const getValue = document.getElementById('blog-test');

1,

const getValue = document.getElementById('blog-test');

2 và

const getValue = document.getElementById('blog-test');

3 trả về

const getValue = document.getElementById('blog-test');

7

Như bạn có thể thấy, có một số điểm khác biệt chính giữa ba điểm mà chúng tôi đã đề cập trong bài đăng này

Ngoài ra, bạn cũng nên lưu ý rằng có những ý nghĩa an toàn khác nhau khi sử dụng từng tài sản — đặc biệt là

const getValue = document.getElementById('blog-test');

1. Ví dụ: mặc dù

const getValue = document.getElementById('blog-test');

1 thường được dùng để chèn văn bản hoặc tạo kiểu, nhưng nó cũng có thể được dùng để chèn các thẻ

const getValue = document.getElementById('blog-test');

39 thực thi JavaScript. Mặc dù HTML5 chặn bất kỳ thẻ

const getValue = document.getElementById('blog-test');

39 được chèn qua

const getValue = document.getElementById('blog-test');

1 nào thực thi, nhưng có nhiều cách khác để thực thi JavaScript không liên quan đến

const getValue = document.getElementById('blog-test');

39

Vì vậy, hãy chú ý khi sử dụng

const getValue = document.getElementById('blog-test');

1, vì các cuộc tấn công độc hại có thể nhắm mục tiêu vào bất kỳ vị trí nào trong mã của bạn sử dụng

const getValue = document.getElementById('blog-test');

1 để đặt hoặc cập nhật một phần tử.  

Mục đích chính của InternalHTML là gì?

Việc sử dụng InternalHTML có tốt không?

Tôi nên sử dụng InternalHTML hay InternalText?

Tôi nên sử dụng InternalHTML hay createElement?