/codegym.vn/ - 45
Lưu ý: Giá trị nhận được từ prompt luôn có kiểu dữ liệu là string, cho dù người dùng
có nhập số hợp lệ đi chăng nữa. Trong trường hợp đó, để chuyển đổi giá trị này thành
giá trị số, chúng ta có thể sử dụng hàm Number() như dưới đây:
1.
typeof
radius
;
// "string"
2. radius
=
Number
(
radius
);
3. console
.
log
(
radius
);
// 2.5
4.
typeof
radius
;
// "number"
Như vậy, chúng ta có thể viết ngắn gọn quá trình nhập một số vào như sau:
1.
let
radius
=
Number
(
prompt
(
"Vui long nhap ban kinh hinh tron:"
));
Đọc giá trị của ô input từ trong tài liệu HTML
Trong tài liệu HTML có thể có những thẻ input. Các thẻ này được trình duyệt hiển thị
dưới dạng những ô nhập liệu mà người dùng có thể nhập giá trị vào. Trình duyệt cũng
cung cấp sẵn một số hàm JavaScript để lập trình viên có thể đọc được giá trị của các
ô input đó.
Chẳng hạn, chúng ta có một tài liệu HTML với thẻ input như sau:
1. <h3>Circles Calculator</h3>
2. <label>
3. Ban kinh: <input type
=
"text" id
=
"radius">
4. <button onclick
=
"showArea
()
">Area</button>
5. </label>
6. <script type
=
"text/JavaScript">
7.
function
showArea
()
{
}
8. </script>
Chúng ta có thể sử dụng hàm JavaScript như sau để đọc giá trị nhập vào của phần
tử input có id là radius ở trên:
1.
let
radius
=
document
.
getElementById
(
"radius"
).
value
;
Giải thích
Ở dòng lệnh trên, chúng ta đã sử dụng hàm getElementById() có sẵn của đối tượng
document để lấy về giá trị của thẻ input có tên là radius.
Hãy thử hoàn thành hàm showArea() với câu lệnh trên để giúp tính ra cho người dùng
bán kính của hình tròn. Sau đó thực thi chương trình để xem kết quả.
1.
function
showArea
()
{
2.
let
radius
=
document
.
getElementById
(
"radius"
).
value
;
3. console
.
log
(
"Doc duoc gia tri ban kinh la "
+
radius
);
4.
let
area
=
radius
*
radius
*
3.14
;
5. console
.
log
(
"Tinh duoc gia tri dien tich la "
+
area
+
" voi PI = "
+
3.14
);
6. alert
(
"Dien tich hinh tron co ban kinh "
+
radius
+
" la "
+
area
);
7. console
.
log
(
"Nguoi dung da nhan duoc ket qua!"
);
8.
}
Lưu ý: cũng như prompt(), kết quả nhận được từ thuộc tính value ở đây cũng luôn có
kiểu dữ liệu string.
