شئ Math
شئ Math هم يکي ديگر از اشياي درون ساخت جاوااسکريپت است که شامل يکسري مقادير ثابت و همچنين توابعي براي انجام عمليات رياضي در صفحات وب ميباشد. براي ساختن اين شئ نيازي به دستور new نيست چون اين شئ براي مفسر جاوااسکريپت، کاملاً شناخته شده است. اين شئ هم مانند بقيه اشياء داراي خصوصيات و متدهايي است که ابتدا به معرفي چند متد پرکاربرد از اين شئ مي پردازيم و سپس با بقيه آنها آشنا خواهيم شد.
خلق اعداد تصادفي، Random number
شئ Math داراي يک متد مفيد براي خلق اعداد تصادفي بنام random است که الگوي آن بصورت زير ميباشد:
در متد بالا، جاوااسکريپت بين عدد يک و صفر، يک عددي را انتخاب مي کند که اين عدد اعشاري است. هرگاه نياز داشتيد که اين متد بين صفر و يک عدد بزرگتر از يک، عدد تصادفي پيدا کند بايد طبق الگوي زير عمل کنيد:
کد:
Math.random ( ) * num
که بجاي num عدد مورد نظر را مي نويسيد.
کد:
<script type="text/javascript" type="text/javascript">
document.write(Math.random() * 10)
</script>
خروجی به اين صورت خواهد بود :
گرد کردن اعداد اعشاري
همانطور که از اسم اين متد پيداست، براي گرد کردن يک عدد اعشاري استفاده مي شود که البته همين متد را به سه مدل مي توان تعريف کرد:
براي گرد کردن يک عدد اعشاري به عدد صحيح بعد از خود بايد به شکل زير عمل کنيد:
کد:
document.write(Math.ceil ( 4.25 ) )
خروجی این دستور عدد 5 است .
براي گرد کردن يک عدد اعشاري به عدد قبل:
مثال )
کد:
document.write(Math.floor ( 4.80 ) )
خروجی اين دستور عدد 4 است .
و براي گرد کردن عدد اعشاري به نزديک ترين عدد:
مثال )
کد:
document.write(Math.round ( 6.49 ) )
خروجی این دستور عدد 6 است .
بهتر است براي خلق اعداد تصادفي، اين دو متد گفته شده را با هم ترکيب کنيد تا اعداد صحيح بدست بيايند.
مثال )
کد:
document.write(Math.round ( Math.random( )*10 ) )
خروجی به طور مثال عدد 9 خواهد بود .
دو متد ديگر وجود دارد که مي توانند بين اعداد تعيين شده، بزرگترين و کوچکترين عدد را پيدا کنند:
کد:
Math.max ( num, num, ... )
Math.min ( num, num, ... )
مثال )
کد:
document.write( Math.max ( 5, 8, 12 ) + "<br />" )
document.write( Math.min ( 5, 8, 12 ) )
خروجی به این صورت خواهد بود :
خصوصيات شئ Math
اين شئ داراي خصوصيات و ثابتهايي است که براي محاسبات عمليات پيچيده رياضي بکار مي رود:
Math.E اين خصوصيت مقدار ثابت عدد Euler را بر ميگرداند که تقريباً برابر است با 2.7182 اين عدد به عدد E معروف است.
Math.PI مقدار ثابت عدد پي که تقريباً برابر است با 3.14
Math.LOG2E لگاريتم عدد Euler بر مبناي دو. تقريباً برابر است با 1.4426
Math.LOG10E لگاريتم E بر مبناي ده. تقريباً برابر است با 0.4342
Math.LN2 لگاريتم دو بر مبناي E. تقريباً برابر است با 0.6931
Math.LN10 لگاريتم ده بر مبناي E. تقريباً برابر است با 2.3025
Math.SQRT2 جذر عدد دو. تقريباً برابر است با 1.4142
Math.SQRT1_2 جذر يک دوم. تقريباً برابر است با 0.7071
توسط اين خصوصيات ديگر لازم نيست که شما اين اعداد را به خاطر بسپاريد و فقط کافي است در صورت نياز، اين خصوصيات را در اسکريپت خود وارد کنيد.
متدهاي شئ Math
متدهايي هم که در زير ليست شده اند، کاربرد کمتري نسبت به متدهاي ذکر شده در ابتداي اين بخش ندارند :
abs قدرمطلق بر ميگرداند.
کد:
document.write( Math.abs ( 7 ) + "<br />" )
document.write( Math.abs ( - 4.67 ) )
خروجی به این صورت خواهد بود :
acos آرک کسينوس نقطه x که يک عدد ميان منفي يک و يک بايد باشد؛ خارج از اين اعداد مقدار NaN بر گردانده مي شود. آرک کسينوس عدد يک برابر با صفر است و منفي يک برابر با عدد پي.
asin آرک سينوس نقطه x که يک عدد ميان منفي يک و يک ؛ خارج از آن مقدار NaN بر گردانده مي شود.
atan آرک تانژانت نقطه x .
atan2 آرک تانژانت زاويه تتا بين دو نقطه x و y .
cos کسينوس يک زاويه را بر ميگرداند.
exp مقدار Exرا بر ميگرداند که E همان عدد ثابت Euler است و x هم يک مقدار عددي.
log لگاريتم يک عدد بر مبناي عدد E .
pow اين متد توان را براي يک عدد محاسبه مي کند و داراي دو پارامتر است که در اولي عدد مشخص مي شود و در پارامتر دوم مقدار عددي توان را تعيين مي کنيد.
کد:
document.write(Math.pow(5,3) + "<br />")
خروجی عدد 125 است .
sin سينوس يک مقدار عددي را محاسبه مي کند.
sqrt جذر يک عدد را برمي گرداند.
tan عددي بر مي گرداند که نشان دهنده تانژانت يک زاويه است.
شئ هاي مربوط به HTML DOM
در بخشهاي قبل با شئ هاي درون ساخت جاوااسکريپت آشنا شديد. در اين صفحه قصد داريم شئ هاي مربوط به HTMLDOM را توضيح دهيم.
تعريف DOM
DOM مخفف سه کلمه DocumentObjectModel مي باشد. در بعضي جاها برگردان فارسي آنرا مدل شئ سند مي گويند. متني که در زير آمده تعريف DOM بر اساس W3C است: " The Document Object Model is a platform- and language -neutral interface that will allow programs and scripts to dynamically access and update the content, structure and style of documents. The document can be further processed and the results of that processing can be incorporated back into the presented page. This is an overview of DOM-related materials here at W3C and around the web. "
اما به زبان ساده، DOM رابطه بين عناصر HTML مانند متن ها، عکس ها و غيره را با همان سند اچ تي ام ال بيان مي کند. اين يک فرآيندي است که به برنامه ها و اسکريپت ها اجازه دسترسي به محتوا و ساختار داخلي پنجره مرورگر را ميدهد تا آنها بتوانند بصورت آزادانه تغييراتي ايجاد کنند که نتيجه اين تغييرات در صفحه وب نمايان شود. در همين رابطه زباني بنام DHTML بوجود آمد که با ترکيب کردن عناصر اچ تي ام ال با استايل شيت و اسکريپتها مي تواند محتواي اسناد وب را بصورت متحرک و پويا درآورد. در اينجا پويا بودن فقط به اين منظور نيست که متنها حرکت کنند و از يک طرف وارد بشوند و از طرف ديگر خارج؛ ممکن است لينکها هر بار شما را به يک سايتي پيوند دهند و يا عکس ها مرتب تغيير کنند، کلاً هر تغييري که نياز به کدنويسي مجدد براي آن سند را نداشته باشد، منظور پويا بودن را مي رساند.
سلسله مراتب اشياء DOM
جاوااسکريپت، شئ هايي دارد که مي توانند بطور مستقيم با خود مرورگر ارتباط برقرار کنند و همچنين شئ هايي که با صفحه وب در ارتباط هستند. در کل مي توان اين اشياء را به دو دسته اصلي تقسيم کرد، دسته اول که BOM گفته مي شود يعني BrowserObjectModel شئ هايي که با پنجره مرورگر مي توانند ارتباط برقرار کنند و دسته دوم DOM که با Document يعني همان سند اچ تي ام ال. تمامي اين اشياء بر اساس يک سلسله مراتبي اين ارتباط را برقرار مي کنند که در رأس آنها شئ window مي باشد.
همانطور که در شکل مشاهده کرديد از شئ window تا شئ Document جزو دسته BOM مي باشند و اشياء بعد از Document در دسته DOM قرار مي گيرند. ناگفته نماند که در حال حاضر کمتر صحبت اصطلاح BOM مي شود و کلاً اين مجموعه را DOM مي گويند.
شما بايد اين سلسله مراتب را براي استفاده اشياء آن، رعايت کنيد. اين سلسله مراتب را مي توان به شجره نامه تشبيه کرد و شما مجبور هستيد براي صدا کردن هر شخص آنرا با نام پدرش بياوريد و در بعضي جاها حتي نام پدر بزرگ هم لازم است، بطور مثال: علي فرزند محمد يا علي فرزند محمد فرزند حسين. در اينجا هم پدر اصلي Window مي باشد وپدر بعدي Document است که فرزندهاي آن همان عناصر اچ تي ام ال ميباشند و سپس Form و در آخر هم Select که تنها يک فرزند دارد. براي استفاده از آنها بايد ابتدا اسم پدر و سپس اسم فرزند را نوشت و در آخر هم خصوصيت و يا متد آن فرزند که همه اينها با يک نقطه از هم بايد جدا شوند. بطور مثال اگر ميخواهيد يک فرم را بنام form1 صدا بزنيد تا با آن ارتباط برقرار کنيد بايد به شکل زير عمل شود:
کد:
window.document.form1
مانند همه اشياء در جاوااسکريپت ، اين شئ ها هم داراي خصوصيات و متدهايي هستند که بعد از رعايت کردن سلسله مراتب با گذاشتن يک نقطه مي توانيد آنها را بنويسيد. مانند:
کد:
window.history.go (-1)
که اگر اين شئ را در يک لينک قرار دهيد با کليک کردن بر روي آن، کاربر به صفحه قبل بازگشت داده مي شود.
در جدول زير شئ هاي اصلي اين سلسله مراتب ليست شده است.
اين شئ در جاوااسکريپت مستقيماً با پنجره مرورگر ارتباط برقرار مي کند. شئ window اولين شئ در سلسله مراتب DOM مي باشد.
مانند تمام شئ هاي جاوااسکريپت اين شئ هم داراي خصوصيات و متدهايي است که توسط آنها مي توانيد بعضي از فعاليتهاي يک مرورگر را کنترل کنيد. براي هر صفحه وب داخل مرورگر يک شئ window در نظر گرفته مي شود، يعني اگر شما از يک فريم استفاده مي کنيد که سه صفحه وب را در خود جاي داده پس سه شئ window براي هر کدام از آنها وجود دارد.
window objects
اين شئ داراي اشياء ديگري نيز مي باشد که به عنوان شئ هاي فرزند براي آن شناخته مي شوند. اين اشياء عبارتند از:
کد:
navigator, frame, document, location, history, screen
خصوصيات شئ window
جدول زير خصوصيات اين شئ ميباشد، نسخه هاي دو مرورگر اينترنت اکسپلورر و نت اسکيپ که از اين خصوصيات پشتيباني مي کنند، مشخص شده است.
دقت کنيد که اين خصوصيات کاربرد کمي دارند و بيشتر متدهاي اين شئ هستند که مورد استفاده قرار مي گيرند. تنها خصوصيتي که کاربرد زيادي دارد status مي باشد که توسط آن مي توانيد متني را به نوار وضعيت مرورگر اضافه کنيد.
نکته: شما مي توانيد بجاي نوشتن window از self يا parent هم استفاده کنيد. خيلي ها براي راحتي نوشتن از اين دو کلمه استفاده مي کنند که در حقيقت منظور همان شئ window مي باشد. به اين صورت:
کد:
window. status =" Hello! "
self. status = " Hello! "
parent. status = " Hello! "
متدهاي شئ window
شئ navigator
navigator يکي ديگر از اشياء DOM مي باشد که اطلاعاتي را در ارتباط با مرورگر کاربر مي دهد، مانند نوع مرورگر و يا نسخه آن. اين شئ جزو استانداردهاي W3C نيست.
خصوصيات شئ navigator
* منظور از کد مرورگر، اسم داخلي مرورگر مي باشد که در حال حاضر مرورگرهاي معروف مانند Internet Explorer ، Netscape ، Opera، Firefox همه از نام Mozilla استفاده مي کنند.
** Platform به استاندارد يک مجموعه و سيستم گفته مي شود که آن سيستم بر اساس آن طراحي و توسعه پيدا مي کند و افرادي که علاقمند به کار در آن زمينه هستند ملزم به اجراي آن استاندارد مي باشند تا در سيستم هماهنگي ايجاد شود. بطور مثال پلت فرم ويندوز XP ، ويندوز NT 5.1 و همچنين Win32 مي باشد.
کليه خصوصيات در يک مثال بکار رفته و اطلاعاتي که در آن خواهيد ديد، همگي متعلق به مرورگر و سيستم شما مي باشد.
مثال )
کد:
<script type="text/javascript" type="text/javascript">
var x = window.navigator
document.write("CodeName=" + x.appCodeName)
document.write("<br />")
document.write("MinorVersion=" + x.appMinorVersion)
document.write("<br />")
document.write("Name=" + x.appName)
document.write("<br />")
document.write("Version=" + x.appVersion)
document.write("<br />")
document.write("CookieEnabled=" + x.cookieEnabled)
document.write("<br />")
document.write("CPUClass=" + x.cpuClass)
document.write("<br />")
document.write("OnLine=" + x.onLine)
document.write("<br />")
document.write("Platform=" + x.platform)
document.write("<br />")
document.write("UA=" + x.userAgent)
document.write("<br />")
document.write("BrowserLanguage=" + x.browserLanguage)
document.write("<br />")
document.write("SystemLanguage=" + x.systemLanguage)
document.write("<br />")
document.write("UserLanguage=" + x.userLanguage) </script>
خروجی به اين صورت خواهد بود :
کد:
CodeName=Mozilla
MinorVersion=;SP2;
Name=Microsoft Internet Explorer
Version=4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; SGNetwayToolBar; .NET CLR 1.1.4322; .NET CLR 2.0.50727)
CookieEnabled=true
CPUClass=x86
OnLine=true
Platform=Win32
UA=Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; SGNetwayToolBar; .NET CLR 1.1.4322; .NET CLR 2.0.50727)
BrowserLanguage=en-us
SystemLanguage=fa
UserLanguage=fa
متدهاي شئ navigator
اين شئ داراي دو متد مي باشد:
کد:
window.navigator.javaEnabled ( )
window.navigator.taintEnabled ( )
متد اول، قابليت اجراي اپلتهاي جاوا را در مرورگر کاربر بررسي مي کند و يکي از دو مقدار true يا false را بر مي گرداند. متد دوم براي taint کردن اطلاعات بکار مي رود يعني اطلاعاتي که taint مي شوند، بدون اجازه کاربر از مرورگر به سرور فرستاده نمي شوند. در حقيقت بعضي از اطلاعات را توسط اين متد علامت دار مي کنيد تا هنگام فرستاده شدن به سرور، شما با خبر شويد. لازم بذکر است اين متد در مرورگر اينترنت اکسپلورر از نسخه 5 به بعد فقط مقدار false را برميگرداند، يعني در اين مرورگر ديگر کارآيي ندارد.
HTML DOM
شئ frame
اين شئ ، فريمهاي داخل پنجره مرورگر را کنترل مي کند. اگر داخل پنجره مرورگر چند فريم داشته باشيم، براي هر فريم يک شئ window در نظر گرفته مي شود بنابراين ما ديگر نمي توانيم براي ارتباط با پنجره اصلي که اين فريمها را در خود جاي داده است از شئ window استفاده کنيم چون اگر در هر کدام از فريمها شئ window را بنويسيم به همان فريم بر مي گردد. در اين حالت براي ارتباط برقرار کردن با پنجره اصلي که اين پنجره هاي فرزند را در خود جاي داده، از شئ parent بايد استفاده کنيم.
خصوصيات و متدهاي اين شئ به شرح زير مي باشند.
خصوصيات شئ frame
به غير از id بقيه خصوصيات، استاندارد W3C مي باشند.
متدهاي شئ frame
اين شئ دو متد دارد که فقط در مرورگر اينترنت اکسپلورر اجرا مي شوند و در ضمن استاندارد هم نمي باشند:
متد blur تمرکز را از روي فريم برمي دارد و focus دوباره تمرکز را روي فريم برميگرداند.
HTML DOM
شئ document
شئ document يکي از مهمترين اشياء DOM مي باشد چون اين شئ قابليت دسترسي به عناصر HTML را دارد و به شما اجازه مي دهد تا از طريق جاوااسکريپت هم اين عناصر را کنترل کنيد. شما در طول آموزش جاوااسکريپت با يکي از پرکاربردترين متد اين شئ آشنا شده ايد يعني :
مجموعه عناصر اچ تي ام ال که توسط اين شئ قابل دسترسي هستند و مي توانيد با آنها ارتباط برقرار کنيد، به شرح زير مي باشند:
کد:
anchors, applets, attributes, embeds, forms, images, links, plugins, stylesheets
نکته : منظور از عنصر anchor کل تگهاي لينک مي باشد چه به داخل يک صفحه اشاره کنند چه به خارج از آن صفحه وب پيوند داده شوند و عنصر link همان تگي است که در قسمت head يک سند اچ تي ام ال قرار مي گيرد.
دقت کنيد که ارتباط شئ document با attributes ، embeds ، plugins و style sheets جزو استانداردهاي W3C نمي باشد.
خصوصيات شئ document
* استفاده از آنها توسط W3C توصيه نمي شود.
لازم بذکر است که documentElement و lastModified جزو استانداردهاي W3C نمي باشند.
متدهاي شئ document
رويدادهايي هم وجود دارد که براي اين شئ مي توانيد بکار بريد که الگوي استفاده از آنها مانند زير مي باشد:
کد:
document.event_name = "some javascript code"
اين رويدادها به شرح زير مي باشند که هيچ کدام از آنها استاندارد W3C نيستند.
کد:
onClick, onDblClick, onFocus, onKeyDown, onKeyPress, onKeyUp, onMouseDown, onMouseMove, onMouseOut, onMouseOver, onMouseUp, onResize
علاقه مندی ها (Bookmarks)