Làm việc trong một dự án, một trong những trang web sẽ hiển thị danh sách mọi người (cụ thể là danh sách những người từ một lớp tốt nghiệp chưa được định vị). Thay vì cập nhật thủ công các danh sách này trong các bảng là cách thực hiện Web 1.0, tôi muốn lấy danh sách tên đã gửi, chuyển chúng sang danh sách .txt đơn giản và sau đó hiển thị danh sách đó trên trang web. Show Cho đến nay, cách dễ dàng để làm điều này là sử dụng phần tử iframe ... Chỉ có điều là, tôi không thể (hoặc không biết cách) áp dụng bất kỳ kiểu dáng văn bản nào cho nội dung của iframe. Tôi đã xuất bản một mẫu về những gì tôi có thể hoàn thành ở đây: http://dongarber.com/test//helpus-iframetest.html Phông chữ mặc định là chuyển phát nhanh và khách hàng có thể sẽ không quá quan tâm đến nó. Có cách nào tốt hơn để làm điều này không, điều đó không yêu cầu ASP.NET hoặc cơ sở dữ liệu? Cập nhật lần cuối: ngày 22 tháng 8 năm 2022 Trong - JavaScript Trong hướng dẫn này, chúng tôi sẽ chỉ cho bạn giải pháp đọc tệp văn bản và hiển thị trong HTML bằng JavaScript, ở đây chúng tôi đã xác định thẻ đầu vào tệp để thu thập tệp văn bản và trong đối tượng đầu đọc tệp được xác định tập lệnh và chúng tôi tải tệp văn bản đã tải lên bằng sự kiện Onload. Chúng tôi đang truy xuất tất cả các văn bản từ tệp bằng đối tượng đầu đọc tệp và nối vào phần tử div được xác định trong khối HTML để hiển thị toàn bộ nội dung trong tệp văn bản được tải lên theo phương thức readastext (). Hướng dẫn từng bước về đọc tệp văn bản và hiển thị trong HTML bằng JavaScript:-Ở đây chúng tôi đã xác định thẻ đầu vào với loại tệp để tải lên tệp văn bản và thẻ div được xác định với ID id res, cho các nội dung tệp được truy xuất trên trang web. Trong tập lệnh, chúng tôi thêm trình nghe sự kiện trên thẻ đầu vào bằng ID id, sau đó xác định chức năng trong đó để đọc tệp văn bản. Ở đây chúng tôi tạo đối tượng đầu đọc tệp 'file_reader' sau đó chúng tôi thêm sự kiện onload với hàm được xác định sau đó, trong đó chúng tôi đặt vị trí đối tượng file_reader sau đó sử dụng phương thức readastext () Chúng tôi đọc nội dung của tệp văn bản từ vị trí đầu tiên và được thêm vào tất cả các nội dung trên div phần tử div 'res'. <!DOCTYPE html> <html> <head> <title>Read and Display Text File</title> </head> <body> <input type="file" name="rf" id="infl"> <div id="res"></div> <script> document.getElementById('infl').addEventListener('change',function(){ var file_reader=new FileReader(); file_reader.onload=function(){ document.getElementById('res').textContent=file_reader.result; } file_reader.readAsText(this.files[0]); }) </script> </body> </html>
Sự kết luận :-Tóm lại, bây giờ chúng tôi có thể biết cách đọc tệp văn bản và hiển thị trong HTML bằng JavaScript. Khi chúng tôi thực hiện chương trình này trên trình duyệt, chúng tôi có thể thấy tùy chọn tải lên tệp mà người dùng cần tải lên .txt nhập bất kỳ một tệp nào sau đó kết quả của tệp đó chứa các văn bản sẽ được hiển thị trên trang web. Nếu bạn đã tải lên một số tệp loại khác có nghĩa là nó truy xuất và hiển thị nhưng chúng ta có thể đọc chúng vì chúng ta cần định dạng chúng. Để đọc bất kỳ loại tệp nào, chúng tôi cần sử dụng trình đọc tệp với một số quy trình khác sau này chúng tôi sẽ thấy về chúng. Tôi hy vọng hướng dẫn này trên tệp văn bản đọc và hiển thị trong HTML bằng cách sử dụng JavaScript giúp bạn và các bước và phương thức được đề cập ở trên rất dễ thực hiện và thực hiện. Nội dung của tệp văn bản là gì?Tệp văn bản là một loại tệp kỹ thuật số, không thể thực hiện được chứa các chữ cái, số, ký hiệu và/hoặc kết hợp.Nó cho phép tạo và lưu trữ văn bản mà không có bất kỳ định dạng đặc biệt nào.Các tệp văn bản còn được gọi là tệp phẳng hoặc tệp ASCII.letters, numbers, symbols and/or a combination. It enables the creation and storage of text without any special formatting. Text files are also known as flat files or ASCII files.
HTML có thể đọc tệp văn bản không?HTML 5 cung cấp một cách tiêu chuẩn để tương tác với các tệp cục bộ với sự trợ giúp của API tệp.API tệp cho phép tương tác với các tệp đơn, cũng như blob.API FileReader có thể được sử dụng để đọc một tệp không đồng bộ trong sự hợp tác với xử lý sự kiện JavaScript.. The File API allows interaction with single, multiple as well as BLOB files. The FileReader API can be used to read a file asynchronously in collaboration with JavaScript event handling. |