گروه مقاله : جاوا اسكريپت Java Script
تاريخ انتشار : 1395/07/22 - 11:00
كد :7198
آموزش مقدماتی نحوه درج کد های جاوا اسکریپت در وب . در این آموزش علاوه بر نحوه درج کد های جاوا اسکریپت چند کد ساده ی جاوا را نیز خواهیم آموخت .
HTML JavaScript
آموزش جاوا اسکریپت در وبسایت
جاوا اسکریپت صفحات وب را بیشتر تعاملی می کند.
مثال:
<!DOCTYPE html>
<html>
<body>
<h1>My First JavaScript</h1>
<button type="button"
onclick="document.getElementById('demo').innerHTML = Date()">
Click me to display Date and Time.</button>
<p id="demo"></p>
</body>
</htm l>
همانطور که می بینید این کد یک دکمه ایجاد می کند که با فشردن آن تاریخ به نمایش در می آید.
تگ <script> در اچ تی ام ال
تگ <script> برای ایجاد اسکریپت های جاوا بکار می رود که در سمت مشتری اجرا می شوند. (شامل کد های سرور نمی شود)
تگ <script> می تواند به یک فایل خارجی با همراه آپشن SRC دسترسی داشته باشد درست همانطور که تگ IMG برای دسترسی به یک عکس از این آپشن استفاده می کند
کاربران عادی از جاوا برای دستکاری عکس ها ، سنجش صحت فرم ها ، و تغییرات زنده روی محتوای سایت استفاده می کنند.
برای انتخاب یک تگ اچ تی ام ال جاوا اسکریپت اغلب از متد
document.getElementById(id)
استفاده می کند. اگر از علاقه مندان جادو های جاوا اسکریپت هستید خط بالا را حفظ کنید در 90 درصد مواقع کار شما را راه می اندازد.
کد های زیر قرار است یک متن Hello JavaScript! را در داخل تگ اچ تی ام ال درج کنند و از طریق
id="demo": این کار را انجام می دهند.
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
دیدن قابلیت های جاوا
درزیر جند مثال برای اینکه ببینید جاوااسکریپت چه توانایی های دارد آمده است.
1. تغییر محتوا در اچ تی ام ال :
document.getElementById("demo").innerHTML = "Hello JavaScript!";
2. جاوا اسکریپت می تواند استایل یا CSS یک فایل اچ تی ام ال را تغییر دهد:
document.getElementById("demo").style.fontSize = "25px";
document.getElementById("demo").style.color = "red";
جاوا اسکریپت می تواند ویژگی های یک تگ را تغییر دهد.
document.getElementById("image").src = "picture.gif";
تگ <noscript> در اچ تی ام ال :
تگ <noscript> برای کاربرانی که توانایی استفاده و یا دیدن کد های جاوا اسکریپ را ندارند و یا مرورگر آنها از کد های جاوا اسکریپت پشتیبانی نمی کند به کار می رود.
مثال
<script>
document.getElementById("demo").innerHTML = "Hello JavaScript!";
</script>
<noscript>Sorry, your browser does not support JavaScript!</noscript>