آموزش مباحث پیشرفته در طراحی صفحات وب

<!-- /* Style Definitions */ p.MsoNormal, li.MsoNormal, div.MsoNormal {mso-style-parent:""; margin:0cm; margin-bottom:.0001pt; mso-pagination:widow-orphan; font-size:12.0pt; font-family:"Times New Roman"; mso-fareast-font-family:"Times New Roman";} @page Section1 {size:612.0pt 792.0pt; margin:72.0pt 90.0pt 72.0pt 90.0pt; mso-header-margin:35.4pt; mso-footer-margin:35.4pt; mso-paper-source:0;} div.Section1 {page:Section1;} -->

javascript - SQL - ADO

آموزش مباحث پیشرفته در طراحی صفحات وب

تهیه و تنظیم:

Mohsen_mahyar@yahoo.com

فصل اول

java script

مقدمه

بنام یگانه ی هستی

جاوا اسکریپت یک زبان اسکریپت می باشد . زبان اسکریپت یک زبان برنامه نویسی کم حجم است.

هر خط جاوا اسکریپت قابل اجرا می باشد .این زبان توسط اکثر ها پشتیبانی میشود ، مانند Browser

Explore , NetscapeInternet برنامه نویسی با زبان جاوا این قابلیت را دارد که می توان کدهای جاوا

اسکریپت را در میان کدهای نیز قرار داد . HTML

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

- HTML

- مبانی برنامه نویسی

- آشنایی با مبانی و یک برنامه مانند AccessDatabase

جهت کد نویسی و طراحی صفحات وب نیاز به یک ساده مانند NotepadText Editor که در تمامی

ویندوزها قابل دسترسی می باشد و نیاز به نصب جدید نیست . EditorText

ضمنا سیستم شما باید دارای مشخصات سخت افزاری ذیل باشد :

- حداقل سیستم مورد نیاز پنتیوم 233

16 مگابایت - Ram

2

- حدود 600 مگا بایت فضای آزاد

در پایان از کاربران محترم خواهشمند است در صورت داشتن هر گونه انتقا د ، پیشنهاد و ارائه سوالات احتمالی با

نویسنده از طریق پست الکترونیکی تماس حاصل نمایند . ریز

Mohsen_mahyar@yahoo.com

چگونه کدهای جاوا اسکریپت را در وارد کنیم؟ HTML برای نوشتن توضیحات : (در ) HTML

// توضیحات

/* توضیحات */

کدهای در کدام قسمت داخل میشود؟ HTML Java Script

هم در قسمت : HEAD

3

اگر کدهای در قسمت HeadJava Script وارد شوند ، مطمئن خواهید بود که در هنگام بارگذاری صفحه

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

هم در قسمت : Body

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

مثال :

وقتی که کد در قسمت باشد : Body

در این مثال وقتی صفحه بارگذاری میشود یک پیغام برای شما نمایش داده میشود. HELLO USER

چگونه یک کد خارجی را در اجرا میکنیم ؟ HTMLJava script

این عبارت را در یک فایل به نام xxx.js

4

ذخیره میکنیم.

و حال آنرا در کد خودمان فرا می خوانیم. HTML

تعریف متغیر ها

-1 اسم متغیر به حروف بزرگ و کوچک حساسیت دارد.

-2 اسم متغیر ها باید با حرف شروع شود.

-در تعریف متغیر استفاده از کلمه دلخواه است. Var

Var strname

مقدار دهی به متغیر ها :

عملگر ها-تعریف عملگرهای محاسباتی

5

جمع +

تفریق -

ضرب *

تقسیم /

باقیمانده %

افزایش یک واحدی ++

کاهش یک واحدی --

تعریف عملگر های مقایسه ای

معادل بودن ==

برابر نبودن !=

بزرگتر از >

کوچکتر از < /

بزرگتر یا مساوی >=

کوچکتر یا مساوی <=

تعریف عملگر های منطقی :

&& and

|| OR

NOT !

تعریف عملگر رشته ای :

الحاق دو رشته +

مثال:

تعریف تابع و توابع در Java Script

اسم تابع ( ,…){ arg1,arg2Function

JS

6

کد های

{

یک تابع میتواند آرگومان هم نداشته باشد.

مثال :

چگونه یک تابع را فراخوانی کنیم

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

آرگومان ( arg1,arg2 ) می باشیم ، با این توضیح که نام آرگومانها بدون () باشند . اگر یک تابع مقداری برای

باز گرداندن به برنامه اصلی داشت باید آن را توسط برگردانیم. Return

مثال :

فرستادن پیغام برای کاربر

اگر بخواهیم برای یک پیغام بنویسیم : User

جملات شرطی :

الف- IF

If ( شرط )

}

در صورت درست بودن شرط کد ها اجرا میشوند

{

ب- IF……ELSE

If

7

( شرط )

}

در صورت درست بودن شرط

{

else

}

در صورت درست نبودن شرط

{

مثال :

اگر ساعت قبل از 10 باشد نشان می دهد و در غیر این صورت Good DayGood Morning نشان

میدهد.

Switch

( شرط) Switch

}

: case Label 1

باشد این کدها اجرا میشود اگر شرط برابر [ ] CodesLabel 1

Break : Case Label 2

باشد این کدها اجرا میشود اگر شرط برابر [ ] CodesLabel 2

Break

Default

8

:

نباشد این کدها اجرا میشود اگر شرط برابر [ ] CodesLabel , Label 2

{

مثال :

زبانهای شیء گرا - Object Oriented یک زبان برنامه نویسی ( شیء گرا ) میباشد. ScriptObject Oriented

در این قسمت مفهوم شیء گرایی می پردازیم. یک برنامه شامل مفاهیم ، ، Properties Object O-O

و میباشد. EventsMethods

اشیاء درون Objects : در دنیای حقیقی ، اشیاء مانند کامپیوتر ، دوچرخه و ... میباشند. در زبان BrowserJS

ها بوده و عبارتند از پنجره ها ، فرمها، دکمه ها و ها. Check Box

Properties : اشیاء نیز دارای مشخصه هایی میباشن د . مثلاً گربه دارای پوست میباشد، کامپیوتر دارای کیبورد و

دوچرخه دارای چرخ است.

Methods : کاری که اشیاء میتوانند انجام دهند Methods

9

نامیده میشود.

Events ) عیاقو :( دهدیم ماجنا ، هدش یحارط هحفص اب راک ماگنه رد ربراک هک دنتسه یتایلمع . شریذپ

) Submitting ) یک فرم و تغییر مکان نشانگر ماوس بر روی یک تصویر دو نمونه از حالات و وقایع اتفاق افتاده

است.

این وقایع توسط دستوراتی به نام برنامه، کنترل می شوند. Event Handler

حلقه های تکرار

-1 حلقه تکرار : While

( شرط ){ While

کدهای JS

{

-2 حلقه تکرار : Do…While

Do

}

کدهای JS

{

(شرط ) while

-3 حلقه تکرار : For

For

10

( مقدار اولیه ; شرط ; افزایش )

}

کدهای JS

{

مثالی از حلقه : For آبجکت String

آبجکت : آبجکت برای کار کردن با متن است . ، یک برای PropertyLengthStringString

است که تعداد کاراکتر های موجود در رشته را بر می گرداند. String

Length :

مثال :

خروجی برنامه:

Esfahan Information Technology Center 37

Fontcolor () رنگ متن را عوض میکند.

Index Of () مکان کاراکتر داده شده را بر میگرداند.

Match () یک لغت در متن را پیدا میکند.

Substr

11

() یک لغت در متن را پیدا میکند.

To LowerCase () دنکیم لیدبت کچوک فورح هب .

To UpperCase () به حروف بزرگ تبدیل میکند.

مثال از متد () FontColor مثالی از متد () IndexOf

این مثال تست میکند که آیا یک متن حاوی یک لغت خاص است یا نه. اگر آن لغت خاص در متن باشد مکان اولین

کاراکتر از آن لغت را برمیگرداند. اولین مکان در متن با عدد 0 مشخص میشود.

مثال از متد () : W3 School Is Great 0 1 2Match

تست میکند که آیا یک رشته حاوی یک لغت خاص است یا نه.

مثال از متد substring() , substr

12

: ()

خروجی :

Format Form

آبجکت آرایه

تعریف یک آرایه :

برای تعریف آرایه حتماً باید از کلمه استفاده کرد. New

) Var My-name=new Array(5

ایجاد میکند این دستور یک آرایه پنج تایی به نام مقدار دهی به آرایه : My-name

چاپ اعضاء آرایه :

چاپ همه اعضاء آرایه

13

معرفی متد ها و خصوصیات یک آرایه

معرفی متد ها و خصوصیات یک آرایه :

تعداد عناصر یک آرایه را برمیگرداند. Length

() دو آرایه را به هم الحاق میکند. Concat

Reverse () آرایه را معکوس میکند.

Sort () آرایه را مرتب میکند.

Join () رشته ای الحاق شده از تمام اعضاء آرایه برمیگرداند.

() یک تکه از آرایه ، برمیگرداند . Slice

مثال :

چیزی که بین اعضاء آرایه قرار میگیرد.

آبجکت Date

آبجکت : Date

هنگامی که بخواهیم با مقادیر زمان و تاریخ کار کنیم از این استفاده میکنیم .برای تعریف یک آبجکت Object

باید از دستور زیر استفاده کنیم. Date

()Var my-date=new Date

بعد از تعریف جدید با استفاده از متد ها میتوان به مقادیر آبجکت DateObject

14

دسترسی داشته باشیم.

معرفی متدهای Date

معرفی متدهای : Date

برمیگرداند. Date() Date

31 ) / تنظیم میکند. - آبجکت () روزهای هفته را برمیگرداند ( 1 set / getDate

set / getDay (0- () روز های هفته را برمیگرداند ( 6 set / getMonth / (0- ()ماه را برمیگرداند ( 11

تنظیم میکند.

()ساعت را برمیگرداند / تنظیم میکند set / getMinutesset / getHour () دقیقه را برمیگرداند / تنظیم

میکند.

() ثانیه را برمیگرداند / تنظیم میکند. set / getSecond

set / getYear () سال را برمیگرداند / تنظیم میکند.

آبجکتهای Window

آبجکتهای : Window 15

مثال:

باز کردن یک پنجره جدید - window.open

باز کردن یک پنجره جدید window.open در این مثال وقتی رو ی کلید کلیک کنیم یک پنجره جدید باز میشود که حاوی سایت YahooURLOpen

میباشد.

مثال تکمیلی برای تغییر خصوصیات پنجره باز شده :

مثالی از ترکیب متدهای Confirm , alert

16

:

چگونه یک پیغام را در خط وضعیت ( ) اینترنت اکسپلورر قرار دهیم؟ Status Bar گرفتن از صفحه Print

مثال :

17

به وسیله این مثال میتوان در یک صفحه چندین پیوند را نشان داد.

آبجکت Browser

-1 تشخیص نوع : Browser توسط از آبجکت می توان نوع را مشخص کنی م . برای آبجکت BrowserNavigatorProperty

، های دیگری نیز وجود دارد : PropertyNavigator

نوع Browser

تشخیص ورژن Navigator . appName

تشخیص سیستم عامل . Browser .appVersionPlatform

آدرس موجود در خط آدرس را میدهد . برای اینکه آیا یک PluginReferrerBrowser نصب است

. Plugins

-2 تشخیص مانیتور : Resolution -3 تشخیص رنگ کامپیوتر : Mode 18

مثال قرار دادن پیامها در : Status Bar

هنگامی که روی لینک میرویم در خط وضعیت عبارت Best Kind In The WorldMy Son نمایش

داده میشود.

ایجاد ها Rollover

مفهوم Rollover بسیار ساده میباشد . بدین معنا که ابتدا دو تصویر وجود داشته تصویر اول در هنگام دریافت

صفحه وب توسط کاربر در نمایش داده میشود . بعد از اینکه کاربر ماوس را بر روی اولین تصویر برد، Browser

پس از چند ثانیه تصویر دوم را با تصویر اول عوض میکند. Browser

مثال :

، توضیحی درون مستطیل میدهد. Alt

آبجکت Frame

بررسی تگ در HTMLFrame

19

:

مفهوم مشخص کننده چندین قاب در صفحه وب بوده و دارای تگهای FrameFrameset برای هر صفحه

/ 1 نظر / 28 بازدید
shima

سلام یک پرو راجب زبان سی می خواهم[تماس]