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

به روز ترین مطالب آموزشی و متدلوژی های برنامه نویسی

سربرگ HTML

۴۸ بازديد

سربرگ HTML‏‏

یاد گرفتیم که یک نمونه داکیومنت HTML دارای ساختار زیر می باشد.

Document declaration tag
< html>
< head>
    Document header related tags
< head>
< body>
    Document body related tags
< body>
< html>

این فصل جزئیات بیشتری در مورد بخش سربرگ در HTML ارائه می دهد که به وسیله ی برچسب< head>نمایش داده می شود. برچسب< head>حاوی برچسب های مهمی می باشد که عبارتند از:< title>, < meta>, < link>, < base>,< style>, < script >, و < noscript > tags.


برچسب < title> در HTML

این برچسب برای تعیین تیتر داکیومنت HTML استفاده می شود. در زیر مثالی می بینید از ارائه ی تیتر به داکیومنت HTML.


نمونه یک

HTML Title Tag Example

Hello, World!

 

برچسب < meta> در HTML

این برچسب برای ارائه ی متادیتا در مورد داکیومنت HTML استفاده می شود که اطلاعاتی از قبیل انقضا صفحه، گردآورنده ی صفحه، لیست کلمات کلیدی، توصیف صفحه و غیره ارائه می دهد.
در ادامه استفاده های مهم برچسب < meta> در داکیومنت HTML ارائه شده اند

 

نمونه دو

HTML Title Tag Example
 
 
 
 
 
 

Hello, World!

برچسب < base> در HTML

این برچسب برای تعیین URL پایه برای همه ی URL های وابسته در صفحه استفاده می شود، که به این معناست که همه ی URL های دیگر هنگامی که برای آیتم ارائه شده قرار می گیرند، دیگر URL ها به URL پایه زنجیر خواهند شد.
به عنوان مثال تمام صفحات و تصاویر ارائه شده، پس از پیشوند دار کردن URL های ارائه شده با URL پایه مسیر prefixing جستجو خواهند شد

 

نمونه سه

HTML Title Tag Example
Logo Images

برچسب < link> در HTML

این برچسب ارتباط بین داکیومنت جاری و منبع خارجی را تعیین می کند. در ادامه مثالی را می بینید از لینک یک فایل style sheet خارجی موجود در مسیر css با یک web root.

 

نمونه چهار

HTML Title Tag Example

Hello, World!

برچسب< style>در HTML

این برچسب برای تعیین style sheet برای داکیومنت جاری HTML استفاده می شود. در ادامه مثالی را می بینید از تعریف برخی قوانین style sheet در داخل برچسب< style>.

 

نمونه پنج




HTML style Tag Example




Hello, World!





 توجه:

برای فراگیری چگونگی کار Cascading Style Sheet یک آموزش مجزای موجود در اینجا را کلیک کنید.

برچسب< script>در HTML

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

 

نمونه شش




HTML Title Tag Example








جهت مشاهده کدها برروی آموزش طراحی سایت کلیک نمایید 

HTML Marquees

۵۴ بازديد

HTML Marquees
 
آموزش طراحی سایت 

آموزش HTML Marquee ‏ ‏‏

Marquee در HTML یک قطعه اسکرولینگ می باشد که یا به صورت افقی در عرض متن ویا به صورت عمودی در پایین صفحه ی وب شما نمایش داده می شود، بستگی به تنظیمات دارد وتوسط برچسب < fmarquees>مربوط به HTML ایجاد می شود.

 

 توجه:

ممکن است برچسب < marquees> در HTML توسط مرورگرهای زیادی پشتیبانی نشود، بنابراین توصیه می شود که به این برچسب تکیه نکنید، در عوض می توانید از javascript و CSS برای ایجاد چنین تاثیراتی استفاده کنید.

ترکیب ساده برای استفاده از برچسب< marquees> در HTML مانند زیر می باشد:


< marquee attribute_name="attribute_value" ....more attributes>
    One or more lines or text message or image
< /marquee>


ویژگی های برچسب < marquee>

در زیر لیست مهمی از ویژگی های برچسب < marquee> را می توانید مشاهده کنید.

Attribute                                                                                                             Description
width
  این ویژگی عرض marquee را مشخص می کند. می تواند مقداری مانند 10 یا 20 درصد باشد.                                                                  
height
این ویژگی طول marquee را مشخص می کند. می تواند مقداری مانند 10 یا 20 درصد باشد                                                                    .
direction
این ویژگی مسیری را که marquee باید در آن اسکرول شود، تعیین می کند. می تواند مقداری مانند up، down، left و یا right داشته باشد.       
behavior
این ویژگی نوع اسکرول marquee را تعیین می کند. می تواند مقداری مانند scroll، side و alternate داشته باشد.                                        
scrolldelay
این ویژگی میزان تاخیر بین دو پرش را تعیین می کند. می تواند مقداری مانند 10 داشته باشد.                                                                  
scrollamount
سرعت متن marquee را تععین می کند. می تواند مقداری مانند 10 داشته باشد.                                                                                  
loop
تعداد دفعات loop را تعیین می کند. مقدار پیش فرض INFINITE می باشد که به این معناست که در marquee به طور پایان ناپذیری loop انجام می شود. 
bgcolor
این ویژگی رنگ زمینه را به شکل نام رنگ یا مقدار شش تایی رنگ مشخص می کند.                                                                              
hspace
این ویژگی فضای افقی اطراف marque را تعیین می کند. می تواند مقداری مانند 10 یا 20 درصد داشته باشد.                                              
vspace
این ویژگی فضای عمودی اطراف marquee را تعیین می کند. می تواند مقداری مانند 10 یا 20 درصد داشته باشد.                                           



در ادامه چند مثال از استفاده ی برچسب marquee می بینید.


 مثال:

نمونه یک

HTML marquee Tag
This is basic example of marquee

 مثال:

نمونه دو

HTML marquee Tag
This example will take only 50% width
 مثال:

نمونه سه

HTML marquee Tag
This text will scroll from left to right



 مثال:

نمونه چهار

HTML marquee Tag
This text will scroll from bottom to up
جهت مشاهده کدها برروی دوره آموزش طراحی سایت کلیک نمایید

آموزش طراحی سایت-اعداد در جاوا اسکریپت

۹۳ بازديد

 

سلام عزیزان با آموزش جاوا اسکریپت از دوره آموزش طراحی سایت در خدمت شما دوستان هستیم

 

آموزش اعداد در جاوا اسکریپت

 

اعداد در جاوا اسکریپت

آموزش طراحی سایت : زبان جاوا اسکریپت فقط یک نوع متغیر عددی دارد. متغیرهای عددی می توانند از نوع عددی یا اعشاری باشند.

مثال:

var x = 34.00; // A number with decimals

var y = 34; // A number without decimals‎

اعداد بسیار کوچک یا کوچک را می توان با نماد علمی نوشت

مثال:

var x = 123e5; // 12300000

var y = 123e-5; // 0.00123‎

اعداد جاوا اسکریپت همیشه 64 بیتی و با ممیز شناور (در مبنای 10) هستند. برخلاف بسیاری از زبان های برنامه نویسی، جاوا اسکریپت انواع عددی از قبیل : integer (عدد صحیح)، short، long و floating-point تعریف نمی کند و این نوع اعداد در جاوا اسکریپت استفاده نمی شوند. در جاوا اسکریپت اعداد همیشه به صورت ممیز شناور با دو رقم اعشار (double precision floating-point number) ذخیره می شوند که در حقیقت دنبال رو استاندارد بین المللی IEEE 754 می باشد. در این نوع قالب دهی یا فرمت اعداد در 64 بیت ذخیره می گردند، به گونه ای که کسر (fraction) در بیت های 0 تا 51، نما یا توان (exponent) در بیت های 52 تا 62 و علامت (sign) در بیت 63 ذخیره می گردد.

 

دقت اعشار (precision)

اعداد صحیح integer در حداکثر 15 رقم و همیشه به صورت دقیق مطرح می شوند.

 

 

مثال:

 

نمونه یک

 

function myFunction() {

var x = 999999999999999;

var y = 9999999999999999;

document.getElementById("demo").innerHTML = x + "
" + y;

}

 

حداکثر تعداد اعشار، 17 رقم است، اما حساب ممیز شناور همیشه 100% دقیق نیست.

 

نمونه دو

 

function myFunction() {

var x = 0.2 + 0.1;

document.getElementById("demo").innerHTML = "0.2 + 0.1 = " + x;

}

 

به منظور حل مشکل بالا، انجام عمل ضرب و تقسیم کمک زیادی می کند.

مثال:

 

نمونه سه

function myFunction() {

var x = (0.2 * 10 + 0.1 * 10) / 10;

document.getElementById("demo").innerHTML = "0.2 + 0.1 = " + x;

}

 

آموزش طراحی سایت : اعداد شانزده شانزدهی (hexadecimal)

جاوا اسکریپت ثابت های عددی (اعداد ثابتی) را که با 0x شروع می شوند به عنوان اعداد در مبنای شانزده در نظر می گیرد (تفسیر می کند).

مثال:

 

نمونه چهار

function myFunction() {

document.getElementById("demo").innerHTML = "0xFF = " + 0xFF;

}

توجه:

هیچگاه یک عدد را با صفر مقدم ننویسید (مانند این مثال 07(.

بعضی از ویرایش های جاوا اسکریپت یک عدد را در صورتی که با صفر مقدم نوشته شوند، به صورت octal / هشت هشتی تفسیر می کند. به صورت پیش فرض، جاوا اسکریپت اعداد را به صورت اعشاری و در مبنای 10 نمایش می دهد، اما شما می توانید با استفاده از تابع toString() اعداد را به صورت مبنای 16، مبنای 8 یا مبنای 2 (دودئی) (به عنوان خروجی) نمایش دهید.

مثال:

 

نمونه پنج

function myFunction() {

var myNumber = 128;

document.getElementById("demo").innerHTML = "128 = " +

myNumber + " Decimal, " +

myNumber.toString(16) + " Hexadecimal, " +

myNumber.toString(8) + " Octal, " +

myNumber.toString(2) + " Binary."

}

 

Infinity (مقدار بی نهایت)

چنانچه عددی را که بزرگتر از بیشینه ی حد ممکن اعداد در جاوا اسکریپت است محاسبه کنید، مقدار infinity برگردانده می شود.

مثال:

 

نمونه شش

function myFunction() {

var myNumber = 2;

var txt = "";

while (myNumber != Infinity) {

myNumber = myNumber * myNumber;

txt = txt + myNumber + "
";

}

document.getElementById("demo").innerHTML = txt;

}

در صورت تقسیم عددی بر 0 نیز مقدار بی نهایت برگردانده می شود.

مثال:

 

نمونه هفت

function myFunction() {

var x = 2 / 0;

var y = -2 / 0;

document.getElementById("demo").innerHTML = x + "
" + y;

}

توضیح : infinity یک عدد است : typeOf infinity یک عدد برمی گرداند.

مثال:

 

نمونه هشت

function myFunction() {

document.getElementById("demo").innerHTML = typeof Infinity;

}

عبارت NaN- عبارت رزرو شده ی Not a Number

عبارت NaN یک کلمه ی رزرو شده (reserved word) است که بیان می کند یک مقدار از نوع عدد نیست. چنانچه سعی کنید با رشته ی غیر عددی عملیات محسابه ی انجام دهید، جاوا اسکریپت عبارت رزرو شده ی Not a Number را بر می گرداند.

 

نمونه نه

document.getElementById("demo").innerHTML = 100 / "Apple"

اما چنانچه رشته دربردارنده ی یک مقدار عددی باشد، نتیجه نیز یک عدد خواهد بود.

مثال:

 

نمونه ده

document.getElementById("demo").innerHTML = 100 / "10";

می توانید از تابع سراسری (global function) isNaN() برای کشف این مسئله که آیا مقدار یک عدد است یا خیر استفاده کنید.

مثال:

 

نمونه یازده

var x = 100 / "Apple";

document.getElementById("demo").innerHTML = isNaN(x);

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

مثال:

 

نمونه دوازده

var x = NaN;

var y = 5;

document.getElementById("demo").innerHTML = x + y;

 

نمونه سیزده

var x = NaN;

var y = "5";

document.getElementById("demo").innerHTML = x + y;

دستور NaN یک عدد است : typeOf NaN عدد بازمی گرداند.

مثال:

 

نمونه چهارده

document.getElementById("demo").innerHTML = typeof NaN;

اعداد می توانند شی باشند. به طور معمول اعداد مقادیر اولیه ی هستند که از literal ها ایجاد می گردند.

var x = 123‎

اما اعداد را می توان با استفاده از کلیدواژه ی new به عنوان شی (object) تعریف کرد، بدین ترتیب

var y = new Number(123)‎

مثال:

 

نمونه پانزده

document.getElementById("demo").innerHTML = typeof x + "
" + typeof y;

از ایجاد شی number خودداری کنید، زیرا که سرعت اجرا را کاهش داده و عوارض جانبی فراوانی را منجر می شوند. عملگر == برای اعدادی بکار می رود که از لحاظ مقدار برابر باشند.

مثال:

 

نمونه شانزده

var x = 500; // x is a number

var y = new Number(500); // y is an object

document.getElementById("demo").innerHTML = (x == y);

 

توجه داشته باشید که در صورت استفاده از عملگر === دیگر اعداد با مقدار یکسان مساوی یا برابر محسوب نمی شوند زیرا که این عملگر انتظار دارد اعداد هم از نظر نوع و هم از نظر مقدار با هم برابر باشند.

 

نمونه هفده

var x = 500; // x is a number

var y = new Number(500); // y is an object

document.getElementById("demo").innerHTML = (x === y);

بخاطر داشته باشید که مقایسه ی اشی با هم امکان پذیر نمی باشد.

مثال:

 

نمونه هجده

var x = 500; // x is a number

var y = new Number(500); // y is an object

document.getElementById("demo").innerHTML = (x === y);

 

خواص (properties) و متدهای مربوط به اعداد در جاوا اسکریپت

مقادیر اولیه ی مثل 3.14 یا 2014، نمی توانند متد یا خاصیت داشته باشند (زیرا که در اصل این ها شی نیستند که بتوانند خاصیت یا متد داشته باشند). اما در رابطه با جاوا اسکریپت این امر صادق نیست. به این خاطر که زبان بیان شده هنگام اجرای متدها و خصوصیت ها با مقادیر اولیه به مثابه ی شی برخورد می کند. از این رو مقادیر اولیه همچنان قادر هستند در زبان جاوا اسکریپت متد و خاصیت داشته باشند.

 

مثال:

 

نمونه نوزده

document.getElementById("demo").innerHTML = Number.MAX_VALUE;

خاصیت های مربوط به اعداد در جاوا اسکریپت متعلق به دبرگیرنده یا wrapper شی number هستند که خود Number نامیده می شوند. دسترسی به خاصیت های نام برده تنها از این طریق ممکن می باشد.

Number.MAX_VALUE‎

استفاده از myNumber.MAX_VALUE در جایی که myNumber یک متغیر، عبارت یا مقدار است، باعث برگردانده شدن undefined می شود.

مثال:

 

نمونه بیست

var x = 6;

document.getElementById("demo").innerHTML = x.MAX_VALUE;

آموزش طراحی سایت ادامه دارد

آموزش طراحی سایت-javascript

۱۳۱ بازديد
سلام با آموزش طراحی سایت در خدمت شما هستیم .در قسمت قبل در مورد جاوا اسکرپیت صحبت کردیم , حال ادامه آموزش طراحی سایت در خدمت شما هستیم.
جاوا اسکریپت JavaScript زندگی خود را با نام Live Script آغاز نمود، اما شرکت Netscape نام آن را، احتمالا به دلیل هیجانی که می توانست از سوی زبان Java به خود بگیرد، به JavaScript تغییر داد. جاوا اسکریپت برای اولین بار در مرورگر Netscape 2.0 با عنوان Live Script به کار گرفته شد. جاوا اسکریپت یک زبان سبک و مفسر، همراه با قابلیت های شی گرایی (Object Oriented) است که به شما این امکان را داده تا به صفحات ایستاتیک و ساده HTML ، حالت واکنش گرا و تعاملی بدهید. به طور کلی می توان جاوا اسکریپت را در موارد زیر خلاصه کرد. جاوا اسکریپت یک زبان سبک و مفسر می باشد (معنای مفسر این است که برنامه دستورات را به صورت خط به خط خوانده و در پایان هر خط آن را اجرا می کند. بر خلاف کامپایلر که ابتدا کل دستورات را خوانده و اشکال یابی کرده، سپس آنها را یکباره اجرا می کند). این زبان برای ساخت نرم افزارهای میانی شبکه ( واسط ) استفاده می شود. جاوا اسکریپت یک زبان مکمل برای HTML می باشد. این زبان یک پلتفرم باز می باشد. جاوا اسکریپت یک زبان طرف کاربر (Client Side) است . زبان جاوا اسکریپت یک زبان طرف مشتری (Client Side) می باشد، به این معنی که دستورات آن در کامپیوتر کاربر و در مرورگر وی اجرا می شود. دستورات جاوا اسکریپت را مستقیما می توان درون اسناد HTML وارد کرده و یا آنها را در یک فایل مجزا قرار داد و سپس آن فایل را به صفحه HTML پیوند زد. وجود زبان جاوا اسکریپت باعث می شود تا صفحات HTML از حالت Static و ساده درآمده و بتوانند با کاربر ارتباط برقرار کرده، مرورگر را کنترل نموده و به صورت پویا محتویات HTML تولید و به صفحه اضافه کنند. کدهای سمت کلاینت جاوا اسکریپت، قابلیت انجام بسیاری از کارهایی که توسط کد های سمت سرور انجام می شوند را دارا هستند. برای مثال، می توانید کد جاوا اسکریپتی نوشته تا مقدار ورودی کاربر در یک کادر متن را کنترل نموده و در صورتی که وی یک آدرس ایمیل با فرمت صحیح را وارد کرده باشد، اجازه ارسال فرم و اطلاعات درون آن را بدهد. کد های جاوا اسکریپت در صورتی که کاربر تمامی مقادیر مورد نیاز را به درستی در فرم وارد نموده باشد، پس از Submit فرم در صفحه، اجرا می شوند. جاوا اسکریپت می تواند اعمال کاربر، مثل فشردن یک دکمه فرمان، کلیک بر روی یک لینک و... را تشخیص داده و دستورات مورد نظر را پس از انجام این رخدادها، اجرا کند.
مزایای استفاده از جاوا اسکریپت
استفاده از زبان جاوا اسکریپت، مزایای خاصی دارد که از آن جمله می توان به موارد زیر اشاره کرد.
کاهش عملکرد و درگیر نمودن سرور :
با کنترل مقادیر وارد شده توسط کاربر در فیلدهای فرم دریافت اطلاعات، می توانید از ارسال اطلاعات نا صحیح به سرور و پردازش آنها جلوگیری کنید. این کار بار ترافیکی بر روی سرور و همچنین میزان اطلاعات ارسال و دریافت شده را کاهش می دهد.
پاسخ سریع و لحظه ای به کاربر :
به دلیل اجرای سریع کدهای جاوا اسکریپت که در مرورگر کاربر اجرا می شوند، کاربر دیگر مجبور نخواهد بود تا پایان زمان ارسال اطلاعات به سرور و پردازش و سپس لود صفحه جهت دربافت نتیجه خود صبر کند.
بالا رفتن قدرت تعامل با کاربر :
به وسیله جاوا اسکریپت می توانید کدهایی طراحی نموده تا به سرعت به انجام اعمالی مثل کلیک کاربر، عبور موس از روی یک منطقه و یا زدن دکمه های کیبورد، واکنش نشان دهید.
رابط کاربری قوی تر :
به وسیله جاوا اسکریپت می توانید اجزایی مثل منو های بازشو، اسلایدشوها و... را طراحی نموده و به سایت خود، رابط کاربری قوی تری بدهید.

 

محدودیت در کار با جاوا اسکریپت
شما نمی توانید از جاوا اسکریپت، به عنوان یک زبان کامل که تمامی نیازهای برنامه نویسی تان را برآورده می کند، استفاده کنید. این زبان، فاقد امکانات مهم زیر می باشد. زبان کلاینت ساید جاوا اسکریپت، امکان خواندن و نوشتن بر روی فایل ها را به دلیل مسایل امنیتی نمی دهد. جاوا اسکریپت نمی تواند برای ساخت نرم افزارهای جامع و پیشرفته شبکه، به دلیل عدم پشتیبانی مناسب، به کار رود. جاوا اسکریپت فاقد قابلیت اجرای چندین پروسه یا کار به صورت همزمان است.
ساختار دستوری جاوا اسکریپت
یک قطعه کد جاوا اسکریپت، شامل دستوراتی است که درون یک تگ باز و بسته ... ، در صفحات وب HTML تعریف می شوند. می توانید کدهای جاوا اسکریپت خود را که در تگ تعریف نموده اید، در هر جای صفحه وب مورد نظرتان قرار دهید، اما بهترین روش این است که آنها را در تگ ابتدای صفحه (تگ ) بگنجانی تگ به مرورگر اعلام می کند که کلیه دستورات درون این تگ را به صورت مفسر خوانده و اجرا کند. بنابراین ساده ترین کد جاوا اسکریپت می تواند به صورت زیر در صفحه تعریف شود.
‎ ‎دستورات‎ ‎جاوا‎ ‎اسکریپت‎ JavaScript code //‎
‎‎
تگ JavaScript دو خاصیت مهم زیر را می تواند داشته باشد.
Language :
این خاصیت تعیین می کند که شما از چه زبان اسکریپتی برای نوشتن کدهای خود استفاده نموده اید که قاعدتا بایستی javascript باشد. به همین دلیل مرورگرهای جدید، از این خاصیت صرف نظر می کنند.
Type :
این خاصیت نیز نوع دستورات تعیین شده در اسکریپت را تعیین می کرده که رایج ترین مقدار برای آن “ text/javascript “ می باشد. به معنای اینکه به زبان جاوا اسکریپت و به صورت متنی هستند. بنابراین تگ JavaScript شما در حالت کاملتر بایستی به صورت زیر باشد.