معرفی ابتدایی زبان جاوا اسکریپت

با سلام خدمت همراهان همیشگی وب سایت پرنیان طرح

مقاله امروز وب سایت پرنیان ، به معرفی اختصاری و ابتدایی زبان برنامه نویسی جاوا اسکریپت می پردازد.

این زبان برنامه نویسی بسیار آسان برای یادگیری و در عین حال بسیار کاربردی و جذاب است.

شما می توانید با استفاده از این زبان برنامه نویسی ، افکت های بسیار جذابی به صفحات وب سایت خود اضافه کنید.

قصد داریم تا در سری آموزش های جاوا اسکریپت ، تمامی امکانات این زبان مهیج را از ابتدایی تا پیشرفته در کنار شما تمرین کنیم.

شما عزیزان می توانید با مراجعه به این لینک ، از تمامی مقالات وب سایت پرنیان طرح در خصوص JavaScript ، دیدن فرمایید.

همراه پرنیان باشید.

یکی از هزاران متد این زبان ، متد ()getElementById می باشد.

مثال زیر ، یک المان html با آی دی demo را پیدا کرده و سپس آن را با عبارت “Hello JavaScript” جایگزین می کند.

[php]

<button type=”button” onclick=’document.getElementById(“demo”).innerHTML = “Hello JavaScript!”‘>Click Me!</button>

[/php]

نتیجه را از این لینک  تمرین کنید و ببینید .

این زبان برنامه نویسی هم می تواند با دابل کوتیشن ” ” کار کند و هم با تک کوتیشن  ‘ ‘

مثال زیر را ببینید:

[php]

<button type=”button” onclick=”document.getElementById(‘demo’).innerHTML = ‘Hello JavaScript!'”>Click Me!</button>

[/php]

نتیجه را از این لینک  تمرین کنید و ببینید .

در این مثال می خواهیم مقدار src (منبع) ویژگی یک برچسب <img> را تغییر دهیم:

[php]

<button>Turn on the light</button>

<img id=”myImage” style=”width: 100px;” src=”pic_bulboff.gif” />

<button>Turn off the light</button>

[/php]

نتیجه را از این لینک ببینید و تمرین کنید.

تغییر سبک یک عنصر HTML نوعی تغییر ویژگی HTML است:

[php]

<button type=”button” onclick=”document.getElementById(‘demo’).style.fontSize=’35px'”>Click Me!</button>

[/php]

نتیجه را از این لینک ببینید و تمرین کنید.

مخفی کردن عناصر HTML را می توان با تغییر سبک نمایش انجام داد:

[php]

<button type=”button” onclick=”document.getElementById(‘demo’).style.display=’none'”>Click Me!</button>

[/php]

نتیجه را از این لینک ببینید و تمرین کنید.

نمایش عناصر HTML مخفی نیز می تواند با تغییر سبک نمایش انجام شود:

[php]

<button type=”button” onclick=”document.getElementById(‘demo’).style.display=’block'”>Click Me!</button>

[/php]

نتیجه را از این لینک ببینید و تمرین کنید.