JavaScript Where To

< Previous
Next >

JavaScript Where To

Tag <Script> di JavaScript

Dalam HTML, Kode JavaScript harus disisipkan di antara tag <script> dan tag</script>.

Contohnya:

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript in Body</h1>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>

</body>
</html> 

Contoh Old JavaScript dapat menggunakan type attribute : <script type="text/javascript">
type attribute tidak diperluhkan. JavaScript adalah bahasa scripting default dalam HTML

JavaScript Functions dan Events

sebuah function di JavaScript adalah blok kode javaScript, yang dapat dijalankan ketika di called.
Misalnya function bisa berjalan ketika sebuah event terjadi, seperti ketika pengguna mengklik tombol.
Anda akan belajar lebih banyak tentang functions & events dalam artikel berikutnya.

 Penempatan JavaScript di <head> atau <body>.

Anda dapat menempatkan sejumplah scrip dalam dokumen HTML.
Script dapat ditempatkan dalam <body> atau dalam <head> halaman HTML, atau keduanya.

JavaScript di <head>

dalam contoh ini, function JavaScript ditempatkan di <head> halaman HTML.
function dipanggil (called) ketika sebuah tombol diklik.

contohnya:

<!DOCTYPE html>
<html>
<head>
	<script>
	function myFunction() {
	    document.getElementById("demo").innerHTML = "Paragraph changed.";
	}
	</script>
</head>

<body>

	<h1>JavaScript in Head</h1>

	<p id="demo">A Paragraph.</p>

	<button type="button" onclick="myFunction()">Try it</button>

</body>
</html>

JavaScript di <body>

Dalam contoh ini, function JavaScript ditempatkan di <body> bagian dari halaman HTML.
function dipanggil (called) ketika sebuah tombol di klik:

Contohnya

<!DOCTYPE html>
<html>
<body>

<h1>JavaScript in Body</h1>

	<p id="demo">A Paragraph.</p>

	<button type="button" onclick="myFunction()">Try it</button>

	<script>
	function myFunction() {
	    document.getElementById("demo").innerHTML = "Paragraph changed.";
	}
	</script>

</body>
</html>

Meletakkan atau menempatkan Script JavaScript dibawah element <body> akan meningkatkan kecepatan loading tampilan, karena script kompilasi akan memperlambat layar.

External JavaScript

JavaScript juga dapat ditempatkan dalam file eksternal:

External file: myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "Paragraph changed.";
}

script eksternal sangat praktis ketika script yang sama digunakan di banyak halaman web yang berbeda.

file JavaScript memiliki ekstensi file .js
Untuk menggunakan Script external, menempatkan nama script file src (source) attribute dari tag <script>:

Contohnya

<!DOCTYPE html>
<html>
<body>

<h1>External JavaScript</h1>

<p id="demo">A Paragraph.</p>

<button type="button" onclick="myFunction()">Try it</button>

<p>(myFunction is stored in an external file called "myScript.js")</p>

<script src="myScript.js"></script>

</body>
</html>

anda dapat menempatkan referensi script esternal di <head> atau <body> yang anda inginkan.
script akan bersikap seolah-olah terletak persis di tag<script> berada.
Script ekternal tidak dapat berisi tag<script>

 Keuntungan Eksternal JavaScript

Menempatkan script di file eksternal memiliki beberapa keuntungan;

  1. Memisahkan HTML dan Kode
  2. Membuat HTML dan JavaScript lebih mudah dibaca dan memeliharanya (maintain)
  3. cached javaScript files dapat mempercepat loads halaman.
Untuk menambah beberapa file script untuk satu halaman - menggunakan beberapa tag<script>:

Contohnya

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

External References

Script eksternal dapat dirujuk dengan URL penuh atau dengan path relatif ke halaman web saat ini.
Contoh ini menggunakan URL lengkap untuk link ke script:

Contohnya:

<!DOCTYPE html>
<html>
<body>

<h1>External JavaScript</h1>

<p id="demo">A Paragraph.</p>

<button type="button" onclick="myFunction()">Try it</button>

<p>(myFunction is stored in an external file called "myScript.js")</p>

<script src="https://www.w3schools.com/js/myScript.js"></script>

</body>
</html>

Contoh ini menggunakan script terletak di folder tertentu di situs web saat ini:

Contohnya

<!DOCTYPE html>
<html>
<body>

<h1>External JavaScript</h1>

<p id="demo">A Paragraph.</p>

<button type="button" onclick="myFunction()">Try it</button>

<p>(myFunction is stored in an external file called "myScript.js")</p>

<script src="/js/myScript.js"></script>

</body>
</html>

Contoh ini, like ke script yang terletak  di folder yang sama dengan halaman saat ini (dibuka):

<!DOCTYPE html>
<html>
<body>

<h1>External JavaScript</h1>

<p id="demo">A Paragraph.</p>

<button type="button" onclick="myFunction()">Try it</button>

<p>(myFunction is stored in an external file called "myScript.js")</p>

<script src="myScript.js"></script>

</body>
</html>

< Previous
Next >

Hay Semuanya, Mau Tulisan kalian di Munculkan di Web ini, Jika Mau silahkan kunjungi atau Klik Link ini Guest Post Tentunya dengan Persyaratan yang Terpenuhi. Trimakasih ~ Admin

Reaksi:

You Might Also Like:

Use parse tool to easy get the text style on disqus comments:
Show Parser Hide Parser