Rumah > Artikel > hujung hadapan web > Menulis suhu penukaran dalam javascript
Menulis suhu penukaran dalam javascript
- PHPzasal
- 2023-05-26 17:21:091013semak imbas
Dalam kehidupan seharian, kita selalunya perlu menukar Celsius kepada Fahrenheit. Fungsi ini boleh dicapai dengan mudah dengan menulis kod menggunakan JavaScript. Dalam artikel ini, kami akan meneroka cara menulis program penukaran suhu mudah menggunakan JavaScript.
Langkah 1: Halaman HTML
Pertama, kita perlu mencipta halaman HTML supaya pengguna boleh melakukan penukaran dengan memasukkan nilai suhu. Berikut ialah kod HTML:
<!DOCTYPE html>
<html>
<head>
<title>温度转换器</title>
</head>
<body>
<h1>温度转换器</h1>
<form>
<label>输入要转换的温度：</label>
<input type="text" id="temperature">
<br><br>
<input type="radio" name="converter" value="celsius">摄氏度转华氏度
<input type="radio" name="converter" value="fahrenheit">华氏度转摄氏度
<br><br>
<input type="button" value="转换" onclick="convertTemperature()">
</form>
<br>
<p id="result"></p>
</body>
</html>Kod di atas termasuk: tajuk dan borang, termasuk kotak input, butang radio dan butang "Tukar". Kami juga telah menambah perenggan di bawah halaman untuk memaparkan hasil yang ditukar.
Langkah 2: Fungsi JavaScript
Seterusnya, kita perlu menulis fungsi JavaScript untuk melakukan penukaran suhu apabila pengguna mengklik butang "Tukar". Berikut ialah kod JavaScript:
function convertTemperature() {
var input = document.getElementById("temperature");
var temperature = input.value;
var radio = document.getElementsByName("converter");
var result = document.getElementById("result");
if (radio[0].checked) {
var fahrenheit = (temperature * 9 / 5) + 32;
result.innerHTML = temperature + " 摄氏度 = " + fahrenheit + " 华氏度";
} else {
var celsius = (temperature - 32) * 5 / 9;
result.innerHTML = temperature + " 华氏度 = " + celsius + " 摄氏度";
}
}Kod di atas menggunakan fungsi getElementById, getElementsByName dan innerHTML untuk mendapatkan nilai suhu yang dimasukkan oleh pengguna, mendapatkan jenis penukaran yang dipilih oleh pengguna dan memaparkan hasil penukaran.
Jika pengguna memilih "Celsius ke Fahrenheit", atur cara akan menggantikan jenis data dengan jenis Nombor dan menetapkannya kepada suhu pembolehubah, kemudian darabkan nilai input dengan 9/5 dan tambah 32 untuk mengira Fahrenheit yang sepadan, dan akhirnya mengeluarkan hasil penukaran.
Sebaliknya, jika pengguna memilih "Fahrenheit ke Celsius", program juga akan menggantikan jenis data dengan jenis Nombor dan menetapkannya kepada suhu berubah, kemudian tolak 32 daripadanya dan darabkannya dengan 5 /9 untuk mengira Darjah Celsius yang sepadan ialah output, dan hasil penukaran juga adalah output.
Langkah 3: Jalankan atur cara
Akhir sekali, jalankan atur cara dalam penyemak imbas anda dan anda akan melihat penukar suhu mudah, mudah ditukar kepada darjah Celsius selepas melihat hasil penukaran suhu Fahrenheit atau Fahrenheit ke Celcius. Pastikan kod JavaScript adalah betul dan mengikut Model Objek Dokumen (DOM) untuk mendapatkan dan memproses nilai suhu, jenis penukaran dan hasil output.
Ringkasan:
Melalui langkah mudah di atas, kami boleh menulis penukar suhu JavaScript yang sangat praktikal. Walaupun program ini mudah, ia sangat boleh dikembangkan dan boleh melaksanakan lebih banyak fungsi untuk memenuhi keperluan anda yang berbeza, seperti menambah pilihan unit, menyokong lebih banyak rejim suhu, dsb. Ini juga menggambarkan kegunaan JavaScript yang berkuasa sebagai bahasa skrip tujuan umum.
Atas ialah kandungan terperinci Menulis suhu penukaran dalam javascript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!