معرفی JavaScript

معرفی JavaScript

این صفحه شامل نمونه هایی از آنچه JavaScript می تواند انجام دهد می باشد.

جاوا اسکریپت می تواند محتوای HTML را تغییر دهد

یکی از متد های کاربردی در JavaScript  که امکان دسترسی به عناصر HTML صفحه را به ما می دهد getElementById است.

در نمونه زیر از این متد با پیدا کردن عنصر HTML ای با شناسه  demo محتوای درون آن را تغییر میدهد: محتوای درون آن با مقداردهی توسط متد innerHtml تغییر میکند به Hello JavaScript!

تغییر متن در javascript
 document.getElementById("demo").innerHTML = "Hello JavaScript"; 
مشاهده مثال

جاوا اسکریپت کوتیشن دوتایی و تکی را قبول می کند.

کوتیشن در JavaScript
document.getElementById('demo').innerHTML = 'Hello JavaScript';
مشاهده مثال

JavaScript میتواند مشخصه ها یا Attribute ها را تغییر دهد

نمونه زیر تصویر موجود را تغییر میدهد.

تغییر مشخصه در Java Script
<button onclick="document.getElementById('myImage').src='pic_bulbon.gif'">Turn on the light</button>

<img id="myImage" src="pic_bulboff.gif" style="width:100px">

<button onclick="document.getElementById('myImage').src='pic_bulboff.gif'">Turn off the light</button>
مشاهده مثال

JavaScript میتواند استایل های CSS را نیز تغییر دهد

تغییر استایل های تگ های HTML یکی دیگر از کار های شگفت انگیز JavaScript است :

تغییر CSS در Javascript
document.getElementById("demo").style.fontSize = "35px";
or
document.getElementById('demo').style.fontSize = '35px'; 
مشاهده مثال

جاوا اسکریپت می تواند عناصر HTML را مخفی کند

پنهان کردن عناصر HTML می تواند با تغییر سبک نمایش داده شود.

مخفی کردن HTML در JavaScript
document.getElementById("demo").style.display = "none";
or
document.getElementById('demo').style.display = 'none'; 
مشاهده مثال

 

جاوا اسکریپت می تواند عناصر HTML را نمایش دهد

نمایش عناصر HTML پنهان نیز می تواند با تغییر سبک نمایش داده شود:

نمایش html در Javascript
document.getElementById("demo").style.display = "block";
or
document.getElementById('demo').style.display = 'block'; 
مشاهده مثال

 

نظر شما

لطفا نام و نام خانوادگی خود را وارد کنید
لطفا ایمیل خود را وارد کنید لطفا ایمیل صحیح وارد کنید.
لطفا متن نظر خود را وارد کنید
>

یادگیری JavaScript

مقالات و دروس

به خبرنامه مدرسه طراحی وب ایران (وب مهراز) بپیوندید.

لطفا شماره همراه صحیح وارد کنید.
لطفا ایمیل صحیح وارد کنید.

مقالات مرتبط