آموزش رایگان جاوااسکریپت – جلسه دوم | تگ اسکریپت

آموزش رایگان جاوااسکریپت - جلسه دوم | تگ اسکریپت | فراخوانی کد جاوااسکریپت

در جلسه اول آموزش رایگان جاوا اسکریپت ، شما همراهان گرامی سایت آموزی را با معرفی زبان جاوااسکریپت و تاریخچه آن آشنا کردیم.

در جلسه دوم این سری آموزشی قصد داریم در مورد روش های فراخوانی کدهای جاوااسکریپت توضیحاتی ارائه کنیم.

همانطور که در جلسه اول توضیح دادیم ، کدهای جاوا اسکریپت منطق را به دنیای اچ‌تی‌ام‌ال می آورند.

زبان HTML و CSS زبان‌های نشانه‌گذاری هستند و قابلیت کافی برای محاسبات منطقی ندارند.

به‌عنوان مثال نمی‌توان از این دو زبان انتظار داشت تا دو عدد را با هم جمع کند و نتیجه را به کاربر نمایش دهد.

روش های فراخوانی کدهای جاوا اسکریپت

به طور کلی به سه طریق می توانیم از کدهای جاوااسکریپت در یک وبسایت استفاده کنیم:

  1. وارد کردن جاوااسکریپت در بخش <head> صفحه
  2. وارد کردن جاوااسکریپت در بخش <body> صفحه
  3. استفاده از فایل اسکریپت خارجی

در دو روش اول کدهای جاوااسکریپت به طور مستقیم وارد صفحه HTML می شوند. برای وارد کردن کدهای جاوااسکریپت در این دو روش از تگ script استفاده می شود.

۱- وارد کردن اسکریپت در بخش <head>

در هنگام باز شدن یک صفحه وب تگ های موجود در بخش تگ head در سند HTML قبل از سایر اجزای صفحه لود می شوند.

معمولاً هنگامی کدهای جاوااسکریپت در بخش تگ <head> در سند HTML استفاده می شود که بخواهیم مطمئن شویم به هنگام نیاز کدهای ما لود شده اند.

مثال در مورد فراخوانی کد جاوا اسکریپت درون تگ <head> 

آموزش رایگان جاوااسکریپت - جلسه دوم | تگ اسکریپت | فراخوانی کد جاوااسکریپت

[html]<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
document.getElementById(“demo”).innerHTML = “Paragraph changed.”;
}
</script>
</head>
<body>
<h2>My Web Page</h2>
<p id=”demo”>A Paragraph</p>
<button type=”button” onclick=”myFunction()”>Try it</button>
</body>
</html>[/html]

۲- وارد کردن جاوااسکریپت در بخش تگ <body>

این امکان وجود دارد که کدهای جاوااسکریپت را دردرون تگ body و داخل تگ <script> وارد کنیم. در این صورت لود شدن

کدها تا هنگامی که آن بخش از صفحه لود شود به عقب می افتد و اگر صفحه به صورت کامل باز نشود ممکن است اسکریپت ما کار نکند.

مثال در مورد فراخوانی کدهای جاوااسکریپت درون تگ <body> 

[html]<!DOCTYPE html>
<html dir=”rtl”>
<head>
<title>javascript code</title>
</head>
<body>
<script language=”javascript” type=”text/javascript”>
document.write(‘به وبسایت سایت آموزی خوش آمدید’);
</script>
</body>
</html>[/html]

۳- استفاده از فایل اسکریپت خارجی

این امکان وجود دارد که کدهای جاوا اسکرپت را در قسمت <body> صفحه وارد کنیم.

در این صورت لود شدن آنها تا هنگامی که آن بخش از صفحه لود شود به عقب می افتد و اگر صفحه به صورت کامل باز نشود ممکن است اسکرپت ما کار نکند.

برای متخصص شدن در طراحی سایت فروشگاهی با وردپرس روی لینک زیر کلیک کن و تو دوره ثبت نام کن:

دوره فوق حرفه ای طراحی سایت فروشگاهی با وردپرس پروژه محور

برای متخصص شدن در طراحی بخش Front End سایت روی لینک زیر کلیک کن و تو دوره ثبت نام کن:

دوره فوق حرفه ای طراحی سایت با HTML5 و CSS3 پروژه محور

مثال در مورد فراخوانی کد جاوااسکریپت از طریق فایل اسکریپت خارجی

آموزش رایگان جاوااسکریپت - جلسه دوم | تگ اسکریپت | فراخوانی کد جاوااسکریپت

[html]
<!DOCTYPE html>
<html>
<body>
<script src=”myScript.js”></script>
</body>
</html>[/html]

آموزش جاوا اسکریپت – جلسه اول

پیوندهای مهم و کاربردی

تگ های HTML در سایت آموزی

تگ های جدید HTML5 در سایت آموزی

صفات تگ های HTML در سایت آموزی

تگ های منسوخ شده HTML5 در سایت آموزی

تگ های block level و inline level در سایت آموزی

تگ های HTML در W3school

ویژگی های CSS در سایت آموزی

ویژگی های CSS در W3schools

آموزش رایگان جاوااسکریپت – جلسه دوم | تگ اسکریپت – اختصاصی سایت آموزی