Mục lục:
Video: Hướng dẫn lấy html của 1 trang web bất kỳ (Rip giao diện web) 2025
Cách phổ biến nhất để nhập dữ liệu người dùng cho một chương trình JavaScript là sử dụng các phần tử dạng HTML. Phiên bản mới nhất của HTML, HTML5, có một số phần tử hình dạng và thuộc tính mới.
Nhập văn bản
Đầu vào văn bản là loại hình cơ bản nhất của trường mẫu HTML. Chúng được sử dụng để cung cấp cho người dùng trang web một đầu vào trống, nơi cô ấy có thể nhập bất kỳ giá trị nào. Dưới đây là ví dụ về mã được sử dụng để tạo một kiểu nhập văn bản:
Dưới đây là những gì trường này trông giống như trong trình duyệt:
Văn bản giữ chỗ
Văn bản giữ chỗ xuất hiện bên trong trường nhập trước khi người dùng bắt đầu nhập. Nó hữu ích khi nói với người dùng những gì bạn mong đợi họ nhập.
Dưới đây là ví dụ về việc sử dụng văn bản giữ chỗ trong một kiểu nhập văn bản:
Đây là trường trông giống như trong một trình duyệt web.
Tự động lấy nét
Khi trường nhập được chọn và bạn có thể nhìn thấy con trỏ bên trong của nó, nó "đã tập trung. "Nếu bạn muốn một trường nhất định (chẳng hạn như trường Tên Đầu tiên) để có" tập trung "ngay khi trang web tải, bạn có thể sử dụng thuộc tính tự động lấy nét. Dưới đây là những gì có vẻ như:
Email đầu vào
Trường nhập email trông giống như một hộp nhập văn bản và nó hoạt động giống như một trường nhập văn bản trong hầu hết các trường hợp, quá. Tuy nhiên, đôi khi, trình duyệt web xử lý trường nhập email khác với trường nhập văn bản. Ví dụ: khi một trường nhập bằng email "tập trung" trên iPhone, một bàn phím đặc biệt hiển thị có các phím tắt để nhập địa chỉ email.
Dưới đây là ví dụ về việc sử dụng trường nhập bằng email:
Ngõ vào trượt
Đầu vào thanh trượt là trường nhập cho phép người dùng chọn một số nằm trong dải số bằng cách sử dụng tính năng kéo và thả điều khiển.
Đây là mã cho việc tạo thanh trượt:
Dưới đây là tính năng giống như một thanh trượt trong một trình duyệt web.
Bắt buộc
Nếu bạn muốn buộc người dùng nhập giá trị vào trường trước khi có thể gửi biểu mẫu, HTML5 có thuộc tính được gọi là bắt buộc.
Để tạo một trường mẫu yêu cầu, bạn chỉ cần thêm thuộc tính mới trong trường nhập kiểu, như sau:
Khi người dùng cố gắng gửi biểu mẫu này mà không điền vào trường phoneNumber, cô ấy sẽ nhận được một thông báo yêu cầu cô ấy điền vào:
Ngay từ khi viết bài này, không phải tất cả các trình duyệt đều hỗ trợ thuộc tính bắt buộc, nhưng nó được hỗ trợ bởi Chrome, Firefox, Internet Explorer và Opera.
Tìm hiểu thêm
Để biết thêm thông tin về các phần tử và thuộc tính và cách làm việc với chúng trong JavaScript, hãy truy cập vào các hướng dẫn về các mẫu HTML tại Mozilla Developer Network.
