Cara menulis dan melaksanakan kod menggunakan JavaScript dalam halaman web-Soal Jawab bahagian hadapan-php.cn

Cara menulis dan melaksanakan kod menggunakan JavaScript dalam halaman web

PHPz

Lepaskan： 2023-04-19 14:33:27

asal

1957 orang telah melayarinya

Dalam reka bentuk dan pembangunan web, JavaScript ialah bahasa pengaturcaraan yang sangat penting. Keluasan JavaScript ditunjukkan terutamanya dalam JavaScript sisi pelayan, JavaScript sisi klien, Node.js, dsb. Antaranya, JavaScript sisi klien paling banyak digunakan dalam pelbagai aplikasi web (Web App). Oleh itu, kita perlu memahami cara menulis dan melaksanakan kod menggunakan JavaScript dalam halaman web.

Aplikasi JavaScript yang terawal adalah untuk membenamkan skrip dalam halaman HTML, iaitu JavaScript dalaman. Kaedah ini bukan sahaja mudah dipelajari, tetapi menulis kod JavaScript terus dalam halaman HTML membolehkan kami membina kesan JavaScript interaktif dengan lebih pantas. Artikel ini akan memperkenalkan penggunaan JavaScript dalaman.

Memperkenalkan kod JavaScript

Untuk menggunakan JavaScript dalaman dalam halaman HTML, kami perlu memperkenalkan skrip JavaScript dalam kod HTML terlebih dahulu. Kaedah khusus ialah menambah elemen pada halaman HTML dan pada masa yang sama merujuk alamat fail tempat kod JavaScript disimpan dalam atribut src elemen (jika kod JavaScript ditulis terus dalam HTML fail, atribut src boleh ditinggalkan). Seperti yang ditunjukkan di bawah, kami menamakan fail JavaScript yang diimport "script.js":

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>内部JavaScript示例</title>
</head>
<body>
  <h1>内部JavaScript示例</h1>
  <script src="script.js"></script>
</body>
</html>

Salin selepas log masuk

Tambah kod JavaScript dalam halaman HTML

Dalam fail HTML Tulis JavaScript kod terus dalam ````<body> melalui elemen Seperti yang ditunjukkan dalam contoh di bawah, kami boleh menambah elemen butang, dan apabila pengguna mengklik butang, mesej teks "Hello World!"

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>内部JavaScript示例</title>
</head>
<body>
  <h1>内部JavaScript示例</h1>
  <p>点击以下按钮：</p>
  <button onclick="alert(&#39;Hello World!&#39;)">点我</button>
</body>
</html>

Salin selepas log masuk

Di sini kami menggunakan acara onclick untuk mendengar acara klik butang dan muncul kotak mesej apabila acara dicetuskan. Kaedah alert() ialah salah satu kaedah asli yang disediakan oleh JavaScript, yang digunakan untuk muncul kotak mesej dalam penyemak imbas. Menggunakan kaedah ini, kami boleh dengan cepat dan mudah menambah beberapa kod JavaScript pendek pada halaman web.

Tambah kod dalam fail JavaScript

Selain menambah kod JavaScript pada halaman HTML, kami juga boleh menyimpan kod JavaScript secara berasingan dalam fail luaran, dinamakan sebagai " script.js" dan kemudian memperkenalkan fail dalam halaman HTML. Seperti yang ditunjukkan di bawah:

Fail HTML:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>内部JavaScript示例</title>
</head>
<body>
  <h1>内部JavaScript示例</h1>
  <button onclick="clickBtn()">点我</button>
  <script src="script.js"></script>
</body>
</html>

Salin selepas log masuk

Fail JavaScript (script.js):

function clickBtn() {
  alert("Hello World!");
}

Salin selepas log masuk

Apabila pengguna mengklik butang, clickBtn( akan executed ) fungsi dan muncul kotak mesej dalam penyemak imbas.

Kelebihan menggunakan fail JavaScript luaran ialah kod JavaScript yang digunakan semula boleh disimpan ke dalam fail berasingan, dengan ketara meningkatkan kebolehgunaan semula kod. Pada masa yang sama, fail JavaScript luaran juga boleh dirujuk oleh berbilang halaman HTML, meningkatkan kecekapan pembangunan.

Ringkasan

JavaScript Dalaman ialah kaedah membenamkan kod skrip JavaScript dalam halaman HTML. Menggunakan kaedah ini, kami boleh menambah kesan JavaScript dengan cepat dan mudah pada halaman web. Dengan cara ini, kami boleh menulis kod JavaScript terus dalam fail HTML melalui elemen Pada masa yang sama, kami juga boleh menyimpan kod JavaScript secara berasingan dalam fail luaran dan menggunakan kod JavaScript dengan memasukkan fail ke dalam halaman HTML.

Bagaimanapun, dengan JavaScript dalaman kami boleh membawa kemungkinan yang tidak berkesudahan kepada aplikasi web.

Atas ialah kandungan terperinci Cara menulis dan melaksanakan kod menggunakan JavaScript dalam halaman web. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!