عضو شوید


نام کاربری
رمز عبور

:: فراموشی رمز عبور؟

عضویت سریع

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



به وبلاگ من خوش آمدید

تبادل لینک هوشمند

برای تبادل لینک ابتدا ما را با عنوان افرا گرافیک و آدرس afragraphic.LXB.ir لینک نمایید سپس مشخصات لینک خود را در زیر نوشته . در صورت وجود لینک ما در سایت شما لینکتان به طور خودکار در سایت ما قرار میگیرد.







نام :
وب :
پیام :
2+2=:
(Refresh)

آمار مطالب

:: کل مطالب : 37
:: کل نظرات : 0

آمار کاربران

:: افراد آنلاین : 1
:: تعداد اعضا : 0

کاربران آنلاین


آمار بازدید

:: بازدید امروز : 13
:: باردید دیروز : 2
:: بازدید هفته : 15
:: بازدید ماه : 25
:: بازدید سال : 140
:: بازدید کلی : 21684

RSS

Powered By
loxblog.Com

گروه مشاوران طراحی افرا در زمینه انواع امور طراحی ، چاپ، طراحی سایت و مالتی مدیا فعالیت می کند. 66120694 و 66120698 و 09122246022

توابع جاوا اسکریپت | آموزش جاوا اسکریپت | برنامه نویسی سایت
سه شنبه 25 خرداد 1395 ساعت 7:43 | بازدید : 143 | نوشته ‌شده به دست افرا گرافیک | ( نظرات )

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

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

توابع جاوا اسکریپت :

  • همانطور که قبلا گفته شد برای یادگیری زبان جاوا اسکریپت باید با زبان html وهمچنین تگ script آشنایی پیدا کرده باشید زیرا همه ی دستورات اسکریپت درون تگ باز و بسته script تعریف می شود و به عبارتی محدوده کدهای اسکریپت را تعیین می کند.
  • یک تابع جاوا اسکریپت زمانی اجرا می شود که چیزی آن را فراخوانی کند یا صدا زده باشد

مثال :

<html>

<body>

    <p>This example calls a function which performs a calculation, and returns the           result:</p>

    <p id="demo"></p>

    <script>

        function myFunction(a, b) {

        return a * b;

      }

      document.getElementById("demo").innerHTML = myFunction(4, 3);

    </script>

</body>

</html>

خروجی : 12

قواعد دستوری توابع جاوا اسکریپت :

  • یک تابع جاوا اسکریپت است  با کلمه کلیدی function به همراه يک پرانتز باز و بسته در مقابل نام آن تعریف شده است
  • نام تابع می تواند شامل حروف، ارقام ، اهمیت ، و علائم دلار ( قوانین همان متغیر) .
  • پرانتز می تواند شامل یک یا چند پارامتر باشد که با کاما از هم جدا شده اند : (parameter1, parameter2, ...)
  •  کدی که توسط تابع اجرامی شود داخل کروشه قرار میگیرد

 

function name(parameter1, parameter2, parameter3) {
    code to be executed
}

  • پارامتر ، يک متغير است که می توان در هنگام فراخوانی يک تابع ، مقدار آن را به تابع ارجاع داد . به پارامتر ، آرگومان نيز می گويند .
  • متغیر های داخل تابع محلی می باشند
  • آرگومان های تابع ارزش ها یا مقادیر واقعی دریافت شده توسط تابع در زمان فراخوانی می باشد.
  • یک تابع بسیار مشابه یک متد یا یک زیرروال ، در دیگر زبان های برنامه نویسی می باشد

 

فراخوانی توابع جاوا اسکریپت :

   کد درون تابع زمانی که تابع اعلان (تعریف) می شود، بلافاصله اجرا نمی گردد، بلکه تنها زمانی اجرا می گردد که تابع فراخوانی   (invoke) شود مانند :

  •    زمانی که یک رویداد رخ می دهد ( زمانی که کاربر یک دکمه را کلیک می کند )
  •    زمانی که درون کد های جاوا اسکریپت صدا زده می شود
  •    به صورت خودکار ( خود استناد )

مقدار بازگشتی تابع :

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

مثال :

 

var x = myFunction(4, 3);      

function myFunction(a, b) {
    return a * b;    
}

خروجی  : 12

 

 

 

چرا توابع ؟

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

شما می توانید همان کد را چند بار با استدلال های مختلف به تولید نتایج مختلف استفاده کنید.

 

پایان قسمت هفتم

منابع : http://www.w3schools.com/js/js_functions.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic



:: برچسب‌ها: توابع جاوا اسکریپت ,آموزش جاوا اسکریپت,برنامه نویسی سایت ,
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
اپراتور typeof | آموزش جاوا اسکریپت | برنامه نویسی
سه شنبه 25 خرداد 1395 ساعت 7:40 | بازدید : 132 | نوشته ‌شده به دست افرا گرافیک | ( نظرات )

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

اپراتور typeof :

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

در جاوا اسکریپت برای مشخص کردن نوع یک متغیر می توانید از اپراتور typeof استفاده کنید

 

 // Returns string

typeof "John" 

// Returns number

typeof 3.14 

// Returns boolean

typeof false

// Returns object

typeof [1,2,3,4]

// Returns object

typeof {name:'John', age:34}

مثال :

 

<p id="demo"></p>

<script>

     document.getElementById("demo").innerHTML =

     typeof "john" + "<br>" +

    typeof 3.14 + "<br>" +

    typeof false + "<br>" +

    typeof [1,2,3,4] + "<br>" +

    typeof {name:'john', age:34};

</script>

خروجی :

string
number
boolean
object
object

آرایه ها در جاوا اسکریپت یک نوع خاص از شی هستند بنابراین اپراتور typeof نوع [typeof [1,2,3,4 را شی بر می گرداند

 

داده تعریف نشده (undefined ) :

در جاوا اسکریپت متغیر بدون مقدار دارای مقدار تعریف نشده است. بنابراین اپراتور typeof برگشتی undefined خواهد داشت.

 // Value is undefined, type is undefined

 var person;                  

هر متغیر را می توان با تنظیم مقدار تعریف نشده خالی کرد نوع آن نیز تعریف نشده می باشد

// Value is undefined, type is undefined

 

person = undefined;

 

مقادیر تهی  :

یک مقدار تهی با نوع داده تعریف نشده متفاوت است. هر متغیر رشته ای هم دارای نوع داده و هم مقدار است

// The value is "", the typeof is string

var car = ""; 

 

مثال :

<p id="demo"></p>

<script>

   var car = "";

   document.getElementById("demo").innerHTML =

   "The value is: " +

   car + "<br>" +

   "The type is:" + typeof car;

</script>

خروجی :

The value is: 
The type is:string

Null (پوچ) :

 

  • متاسفانه در جاوا اسکریپت نوع داده null  یک شی است.
  • می توان این مسئله را یک bug در برنامه نویسی جاوا اسکریپت دانست.
  • در جاوا اسکریپت null برابر «هیچی» است یعنی چیزی است که وجود ندارد.

 

 // Value is null, but type is still an object

var person = null;

 

تفاوت بین تعریف نشده و Null :
به مثال زیر توجه کنید :
 

// undefined

typeof undefined  

// object

typeof null

 // false

null === undefined 

// true

null == undefined  

 

پایان قسمت ششم

منابع : http://www.w3schools.com/js/js_datatypes.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic

 



:: برچسب‌ها: اپراتور typeof,آموزش جاوا اسکریپت,برنامه نویسی,طراحی سایت,طراحی وب سایت,آموزش وب سایت ,
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
داده در جاوا اسکریپت | آموزش جاوا اسکریپت | طراحی سایت
دو شنبه 24 خرداد 1395 ساعت 7:8 | بازدید : 136 | نوشته ‌شده به دست افرا گرافیک | ( نظرات )

آموزش جاوا اسکریپت                                                                                 قسمت پنجم

انواع داده در جاوا اسکریپت :

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

StringNumberBooleanArrayObject

متغیرهای جاوا اسکریپت می توانند در انواع داده های اعداد، رشته ها ، آرایه ها، اشیاء و ... نگه داری شوند 
 

اعداد

var length = 16;

رشته

var lastName = "Johnson";

آرایه

var cars = ["Saab", "Volvo", "BMW"];

اشیاء

var x = {firstName:"John", lastName:"Doe"};

 

مفهوم انواع داده :
  •  در برنامه نویسی، انواع داده یک مفهوم مهم است
  • برای اینکه عملگر ها بتوانند بر روی متغیر ها عمل کنند نیاز است نوع آن ها مشخص شود
  • یک کامپیوتر عبارت زیر را نمی تواند درک کند :
var x = 16 + "Volvo";

 

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

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

مثال :

<p id="demo"></p>
<script>
      var x = 16 + "Volvo";
     document.getElementById("demo").innerHTML = x;
</script>

خروجی : 16Volvo

 

 

 

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

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

مثال 1 :

<p id="demo"></p>

   <script>

   var x = 16 + 4 + "Volvo ";

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

</script>

ابتدا از سمت چپ به راست 16 + 4 به صورت نوع عددی با هم جمع میشوند وسپس حاصل آن ها به صورت نوع رشته ای به Volvo  متصل می شود

خروجی : 20Volvo

مثال 2 :

<p id="demo"></p>

<script>

    var x = 16 + 4 + "Volvo";

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

</script>

در مثال دوم عبارت با یک رشته شروع شده و جاوا اسکریپت بقیه عبارت را هرچه که باشد رشته در نظر میگیرد و دیگر اعداد را با یکدیگر تجمیع نمی کند.

خروجی : Volvo164

جاوا اسکریپت انواع پویا : 
انواع داده در جاوا اسکریپت پویا می بشاند ، این بدان مفهمو است که یک متغیر می تواند برای انواع مختلف 
داده مورد استفاده قرار گیرد

 

var x;               // نوع داده تعریف نشده
var x = 5;           // نوع داده عددی
var x = "John";      // نوع داده رشته ای

                                                         

رشته ها در جاوا اسکریپت:

  • یک رشته یا یک کلمه  یک سری از کاراکتر های پشت سر هم می باشد
  • رشته ها بین دو علامت کوتیشن " "  قرار میگیرند.شما می توانید از تک کوتیشن   ‘ ’ یا جفت کوتیشن استفاده کنید

var carName = "Volvo XC60";   // استفاده از دابل کوتیشن
var carName = 'Volvo XC60';   // استفاده از تک کوتیشن

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

var answer = "He is called 'Johnny'";    // استفاده از کوتیشین درون جفت کوتیشن

 

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

var x1 = 34.00;     // نوع داده اعشاری
var x2 = 34;        // نوع داده صحیح

  • اعداد خیلی بزرگ یا اعداد خیلی کوچک را میتوان با نماد e نوشت

var y = 123e5;      // 12300000
var z = 123e-5;     // 0.00123

Booleans در جاوا اسکریپت :

نوع داده بولین فقط دو مقدار True  و  False  را دارا می باشد.

var x = true;
var y = false;

نوع داده بولین برای تست در شرط ها استفاده می شود

آرایه جاوا اسکریپت :
 
  • عناصر آرایه به وسیله علامت کاما از یکدیگر جدا می شوند.
  • اندیس آرایه در جاوا اسکریپت از صفر شروه می شود
  • آرایه جاوا اسکریپت درون براکت نوشته می شود

 

مثال 2 :

var cars = ["Saab", "Volvo", "BMW"];

یک آرایه سه عنصری به نام cars

اشیاء جاوا اسکریپت :
در جاوا اسکریپت آبجکت یا همان اشیاء بین علامت آکولاد نوشته می شود.
اشیا در جاوا اسکریپت به صورت نام و مقدار (مقدار خصیصه : نام خصیصه) می باشد
 

مثال  : یک شی با نام person شامل چهار خصیصه  firstName و  lastName و  age و eyeColor می باشد

<p id="demo"></p>

<script>

   var person = {

       firstName : "John",

       lastName  : "Doe",

       age       : 50,

       eyeColor  : "blue"

    };

   document.getElementById("demo").innerHTML =

   person.firstName + " is " + person.age + " years old.";

</script>

خروجی : John is 50 years old

 

پایان قسمت پنجم

منابع : http://www.w3schools.com/js/js_datatypes.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic

 

 



:: برچسب‌ها: داده در جاوا اسکریپت , آموزش جاوا اسکریپت , طراحی سایت , آموزش برنامه نویسی , بهینه سازی وب سایت ,
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
قواعد دستوری (syntax) جاوا اسکریپت |آموزش جاوا اسکریپت|بهینه کردن سایت
دو شنبه 24 خرداد 1395 ساعت 7:3 | بازدید : 135 | نوشته ‌شده به دست افرا گرافیک | ( نظرات )

آموزش جاوا اسکریپت                                                                 قمست چهارم

قواعد دستوری(syntax)  جاوا اسکریپت :

به مجموعه قوانینی که چگونگی ساخت برنامه در جاوا اسکریپت را مشخص می کندد  نحوه دستور نویسی (syntax) گفته می شود.

در یک زبان برنامه نویسی به این دستورالعمل ها statements نامیده می شوند

جاوا اسکریپت یک زبان برنامه نویسی می باشد (که ما از آن در طراحی وبسایت استفاده می کنیم)

دستورات جاوا اسکریپت مانند برخی از زبان ها  از جمله C#,Vb  با (;) از هم جدا می شوند

<script>

   var x = 5;

   var y = 6;

   var z = x + y;

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

</script>

<script>

   var x = 5;

   var y = 6;

   var z = x + y;

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

</script>

دستورات (statemens) جاوا اسکریپت :

در زبان های برنامه نویسی به دستورالمل های برنامه اصطلاحا (statatements) جملات،دستورات گفته می شود.

 

دستورات  جاوا اسکریپت از موارد زیر تشکیل شده است : 

 

  1. Values  (مقادیر)
  2. Operators (عملگرها)
  3. Expressions  (اصطلاحات)
  4. Keywords (کلمات کلیدی)
  5. Comments (تفسیر نویسی)

 

 

جاوا اسکریپت  Values  (مقادیر) :

 

در نحوه کد نویسی در جاوا اسکریپت دو نوع روش برای مقدار دهی معین شده است:

  1. مقادیر ثابت (Fixed Values) که به آنها لیترال ها (Literals) یا مقادیر تحت اللفظی گفته می شود.
  2. مقادیر متغیر  (Variable Values)

لیترال ها (Literals) یا ثابت  (Fixed) :

مهم ترین قوانین برای نوشتن مقادیر ثابت : 
 

   ۱- استفاده از اعداد (ساده یا اعشار) مانند   :  10.50و 1001
   ۲-استفاده از رشته ها (متن) که بین سینگل کوتیشن یا دابل کوتیشن نوشته میشود.مانند “afra” و ‘afra’

جاوا اسکریپت  متغیرها (Variables):

در تمامی زبان های برنامه نویسی از متغیر ها برای ذخیره موقت داده استفاده می گردد.
در جاوا اسکریپت برای تعریف یک متغیر از کلمه کلیدی var استفاده می شود.
از علامت “=” مساوی  برای معرفی مقداری که میخواهیم در متغیر ذخیره کنیم استفاده میکنیم.
مثال :

در مثال زیر یک متغیر x تعریف شده و مقدار 6 به آن انتصاب داده شده است

 

<script>

   var x;

   x = 6;

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

</script>

جاوا اسکریپت  Operators (عملگرها) :

  • جاوا اسکریپت از عملگر = برای انتساب مقدار به متغیر استفاده می کند

مثال : 

var x = 5 ;

var y = 6 ;

  • جاوا اسکریپت از عملگر های محاصباتی  (+ - *  /)  برای محاصبه مقادیر استفاده می کند

مثال : 

 

<p id="demo"></p>

<script>

    document.getElementById("demo").innerHTML = (5 + 6) * 10;

</script>

 

جاوا اسکریپت  Expressions  (اصطلاحات) :

یک اصطلاح از ترکیب مقادیر (Values) ، متغیر ها (Variables) و عملگرها (Operators) که در یک مقدار (Value) محاسبه شده است گفته میشود

مثال : 

5 * 10

x * 10

"John" + " " + "Doe"

جاوا اسکریپت  Keywords (کلمات کلیدی) :

 

از کلمات کلیدی در جاوا اسکریپت برای شناختن عمل های از پیش تعریف شده استفاده می شود.
بطور مثال var یک کلمه کلیدی می باشد که برای ایجاد یک متغیر استفاده می شود.

جاوا اسکریپت  Comments (تفسیر نویسی) :

برخی عبارات در جاوا اسکریپت اجرا نمی شوند.
عباراتی که بعد از علامت ” // ” یا بین دو علامت /*  و  */ تفسیر نویسی یا کامنت گفته میشود و اجرا نمی شوند.

نوشتن کانت یا تفسیر نویسی اختیاری می باشدو فقط به خواناتر شدن بهینه سازی کدها و کارایی آنها کمک میکند

var x = 5;   // I will be executed

// var x = 6;   I will NOT be executed

جاوا اسکریپت  شناسه ها (Identifiers):

  • شناسه ها همان نام ها هستند.
  • در جاوا اسکریپت از شناسه ها برای نام گذاری متغیرها ، کلمات کلیدی ، فانکشن ها و برچسب ها(labels) استفاده میشود

 

  • قوانین نام گذاری در جاوا اسکریپت همانند دیگر زبان های برنامه نویسی می باشد:

 

           اولین کارکتر در نام گذاری یا باید یکی از حروف لاتین یا آندرلاین “_” یا علامت دلار $ باشد.

           کارکتر های بعدی میتوانند یکی یا ترکیبی از حروف لاتین یا علائم ریاضی یا آندرلاین یا علامت دلار باشد.

 

نکته : تمامی شناسه ها در جاوا اسکریپت حساس به کوچکی و بزرگی حروف هستند و براشون حرف  A و a متفاوته.

پایان قسمت چهارم

منابع : http://www.w3schools.com/js/js_output.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic

 



:: برچسب‌ها: آموزش جاوا اسکریپت , طراحی سایت , قواعد دستوری جاوا اسکریپت , جاوا اسکریپت ,
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
خروجی جاوا اسکریپت|آموزش جاوا اسکریپت|طراحی سایت
یک شنبه 23 خرداد 1395 ساعت 8:46 | بازدید : 106 | نوشته ‌شده به دست افرا گرافیک | ( نظرات )

آموزش جاوا اسکریپ                                                                                قسمت 3

 

خروجی جاوا اسکریپت :

 

  • جاوا اسکریپت می تواند داده ها را در روش های مختلف نمایش می دهد :
  1. نمایش خروجی در یک کادر هشدار با استفاده از () window.alert
  2. نمایش خروجی در سند  html  با استفاده از  () document.write 
  3. نمایش خروجی در یک عنصر html با استفاده از () innerHTML 
  4. نمایش خروجی در کنسول مرورگر با استفاده از () console.log

خروجی با استفاده از () window.alert :
 
شما می توانید از یک جعبه هشدار برای نمایش داده ها استفاده کنید

مثال :

<!DOCTYPE html>
<html>
<body>
  <h1>My First Web Page</h1>
  <p>My first paragraph.</p>
  <script>
    window.alert(5 + 6);
  </script>
</body>
</html>

خروجی :

 

خروجی با استفاده از ()document.write :
برای تست کردن وب سایت راحت ترین روش استفاده از  ()document.write می باشد .
مثال :
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
document.write(5 + 6);
</script>
</body>
</html>

 خروجی :

 استفاده از ()document.write بعد از لود شدن کامل صفحه وب سبب پاک شدن کل سند html  صفحه شما می شود

 
مثال :
 

<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<button onclick="document.write(5 + 6)">Try it</button>
</body>
</html>

خروجی : پس از کلیک بر روی button کل صفحه html پاک شده و 11 در خروجی نمایش داده می شود

 
 
نکته : از روش ()document.write باید تنها برای تست وب سایت استفاده شود
خروجی با استفاده ازinnerHTML :

 برای دسترسی به یک عنصر HTML در جاوا اسکریپت می توانیدازکد (document.getElementById(id 

استفاده کنید.

مثال :
 
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My First Paragraph</p>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>
</body>
</html>

 

خروجی :

 

خروجی با استفاده از   ()console.log :

 

شما می توانید از روش ()console.log برای نمایش داده ها در مرورگر شما ، استفاده کنید.
 
مثال :
 
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>

 

 

پایان قسمت سوم

منابع : http://www.w3schools.com/js/js_output.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic

 



:: برچسب‌ها: خروجی جاوا اسکریپت ,آموزش جاوا اسکریپت,جاوا,آموزش وب سایت,سایت بهینه,کدنویسی بهینه,طراحی سایت,طراحی وب سایت ,
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
محل قرار گیری کد اسکریپت|آموزش جاوا اسکریپت|آموزش وب سایت
چهار شنبه 19 خرداد 1395 ساعت 12:20 | بازدید : 105 | نوشته ‌شده به دست افرا گرافیک | ( نظرات )

محل قرار گیری کد اسکریپت                                                                قسمت دوم

تگ <script> :

در html  کد های جاوا اسکریپت بین تگ <script> قرار داده شوند

مثال :

<script>
   document.getElementById("demo").innerHTML = "My First JavaScript";
</script>

توابع (Functions) و رویدادها (Events) در جاوا اسکریپت :

  • یک تابع (Functions) در جاوا اسکریپت یک بلوک از کد جاوا اسکریپت است که می تواند فراخوانی شود
  • برای مثال ، یک تابع زمانی که یک رویداد رخ می دهد اجرا می شود، مانند زمانی که کاربر یک دکمه را کلیک می کند
  •  در فصل های بعدی بیشتر به توابع و رویداد ها می پردازیم
 
شما می توانید هر تعداد از اسکریپت ها در یک سند HTML قرار دهید

اسکریپت ها می توانند در بخش <body> یا <head> یک صفحه html یا هر دو قرار گیرد

جاوا اسکریپت در بخش <head>  :

اسکريپت هايي که می خواهيم در هنگام بروز يک رويداد در صفحه وب سایت ، مثل کليک بر روی يک دکمه خاص و ... اجرا شوند . به عبارت ديگر می خواهيم اجرای آنها کنترل شده باشد . در اين حالت دستورات اسکريپت را در قسمت < head > صفحه و یا در يک فايل خارجی تعريف کرد .

  • کد زیر زمانی فراخوانی می شود که برروی دکمه Try it کلیک شود

<!DOCTYPE html>
<html>

<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>

<body>

<h1>My Web Page</h1>

<p id="demo">A Paragraph</p>

<button type="button" onclick="myFunction()">Try it</button>

</body>
</html>

 

جاوا اسکریپت در بخش <body>  :

اسکريپت های که می خواهيم به محض لود شدن صفحه ، اجرا شده و اثر خود را نمايش دهند . در اين حالت بايد اسکريپت ها را در قسمت  < body > صفحه قرار داد

<!DOCTYPE html>
<html>
<body> 

<h1>My Web Page</h1>

<p id="demo">A Paragraph</p>

<button type="button" onclick="myFunction()">Try it</button>

<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>

</body>
</html>

 

فایل جاوا اسکریپت خارجی :

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

 

 

مثال :

myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "Paragraph changed.";
}

 

<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html>

 

  • یک فایل اسکریپت خارجی را می توان هم در بخش < body > و هم در بخش < head > قرار داد.
  • کد اسکریپت خارجی را نباید درون تگ <script> قرار داد

 

پایان بخش دوم

منابع : http://www.w3schools.com/js/js_whereto.asp

کانون تبلیغاتی افراگرافیک

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

66912056  66562677 66120698   09122246022

http://afragraphic.ir

info@afragraphic.ir

https://telegram.me/afragraphic_ir

http://instagram.com/afragraphic1390

http://facebook.com/AfraGraphic

http://plus.google.com/104048725792771050756

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

http://twitter.com/afragraphic

http://ir.linkedin.com/in/afragraphic

http://aparat.com/afragraphic

http://Telegram.me/afragraphic_ir

http://cloob.com/name/afragraphic

 



:: برچسب‌ها: محل قرار گیری کد اسکریپت,آموزش جاوا اسکریپت,جاوا,آموزش وب سایت,سایت بهینه,کدنویسی بهینه,بهینه سازی سایت ,
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
مقدمه-آموزش ساده جاوا اسکریپت|آموزش جاوا
چهار شنبه 19 خرداد 1395 ساعت 11:22 | بازدید : 88 | نوشته ‌شده به دست افرا گرافیک | ( نظرات )

آموزش JavaScript                                                                                     بخش 1

مقدمه :

این آموزش درباره چگونگی کار کردن جاوا اسکریپت در طراحی وب سایت با html و css است

پیشنهاد نویسنده :

در طول آموزش این دوره سعی کنید مثال های گفته شده در هر فصل را پس از پایان فصل به صورت عملی نوشته ، اجرا کنید و نتیجه را ببینید تا یادگیری بهتر و سریعتری داشته باشید و همچنین وب سایتی بهینه

 

جاوا اسکریپت زبان برنامه نویسی HTML و طراحی وب است

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

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

 

.جاوا اسکریپت یکی از 3 زبانی است که همه توسعه دهندگان وب باید یاد بگیرند

    1.  HTML برای تعریف محتوای صفحات وب
    2.  CSS برای مشخص کردن طرح صفحات وب
    3.  جاوا اسکریپت برای مشخص کردن رفتار صفحات وب
 

 

1. جاوا اسکریپت می تواند محتوای HTML را تغییر دهد :
 
یکی از روش های دسترسی به المان های داخل html گرفتن id با استفاده از متد () getElementById می باشد.

این مثال از این روش برای پیدا کردن یک عنصر html با "id="demo  استفاده کرده و محتوای درون عنصر را به Hello JavaScript تغییر می دهد.

document.getElementById("demo").innerHTML = "Hello JavaScript";

مثال :

 

<body>

    <form id="form1" runat="server">

         <h1>What Can JavaScript Do?</h1>

         <p id="demo">JavaScript can change HTML content.</p>

         <button type="button"

            onclick="document.getElementById('demo').innerHTML = 'Hello JavaScript!'">

            Click Me!</button>

    </form>

</body>
 
 
2. جاوا اسکریپت می تواند ویژگی های HTML را تغییر دهید
 
این مثال با استفاده از جاوا اسکریپت ، خصوصیت src از تگ <img > یک تصویر HTML  را تغییر می دهد .
 

<body>

    <form id="form1" runat="server">

        <img src="pic_bulboff.gif" onclick="changeimg()" width="100" height="150"  id="myImage" />

        <script>

            function changeimg() {

                var image = document.getElementById('myImage');

                if (image.src.match("bulbon")) {

                    image.src = "pic_bulboff.gif";

                }

                else { image.src = "pic_bulbon.gif" }

            }

        </script>

    </form>

</body>
 
اجرا :

6360021531669198831.png

 قبل از کلیک

6360021533038277142.png

بعد از کلیک 

                                                                                                         

 
3. جاوا اسکریپت می تواند سبک ها یا استایل های (CSS) ، HTML را تغییر دهید 

در مثا ل زیر با استفاده از جاوا اسکریپت ،سبک یک عنصر  html را تغییر می دهیم

document.getElementById("demo").style.fontSize = "25px";

مثال :

<body>

    <form id="form1" runat="server">

        <p id="demo">JavaScript can change the style of an HTML element.</p>

        <button type="button" onclick="myFunction()">Click Me!</button>

        <script>

            function myFunction()

            {

                var x = document.getElementById('demo');

                x.style.fontSize = "25px";

                x.style.color = "red";

            }

        </script>

       

    </form>

</body>

 

4. جاوا اسکریپت می تواند داده ها را  اعتبارسنجی (Validate ) کند

جاوا اسکریپت اغلب برای اعتبار سنجی ورودی ها استفاده می شود

مثال :

<body>

    <form id="form1" runat="server">

        <input id="numb" />

        <button type="button" onclick="myFunction()">Submit</button>

        <p id="demo"></p>

        <script>

            function myFunction() {

                var x, text;

                x = document.getElementById('numb').value;

                if(isNaN(x) || x<1 || x>10)

                {

                    text = "Input not valid";

                }

                else

                {

                    text = "Input OK";

                }

                document.getElementById('demo').innerHTML = text;

            }

        </script>

    </form>

</body>

اجرا :

 

 

                              6360021446982755043.png6360021447749598904.png

 

پایان قسمت اول

منابع : http://www.w3schools.com/js/default.asp

 

کانون تبلیغاتی افراگرافیک

 

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

 

66912056  66562677 66120698   09122246022

 

http://afragraphic.ir

 

info@afragraphic.ir

 

https://telegram.me/afragraphic_ir

 

http://instagram.com/afragraphic1390

 

http://facebook.com/AfraGraphic

 

http://plus.google.com/104048725792771050756

 

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

 

http://twitter.com/afragraphic

 

http://ir.linkedin.com/in/afragraphic

 

http://aparat.com/afragraphic

 

http://Telegram.me/afragraphic_ir

 

http://cloob.com/name/afragraphic

 

 

 



:: برچسب‌ها: آموزش JavaScript , آموزش جاوااسکریپت , جاوااسکریپت , طراحی سایت , طراحی وب سایت , طراحی سایت , بهینه سازی سایت ,
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0
مقدمه-آموزش ساده جاوا اسکریپت|آموزش جاواآموزش JavaScript
سه شنبه 18 خرداد 1395 ساعت 13:5 | بازدید : 89 | نوشته ‌شده به دست افرا گرافیک | ( نظرات )

آموزش JavaScript                                                                                     بخش 1

مقدمه :

این آموزش درباره چگونگی کار کردن جاوا اسکریپت در طراحی وب سایت با html و css است

پیشنهاد نویسنده :

در طول آموزش این دوره سعی کنید مثال های گفته شده در هر فصل را پس از پایان فصل به صورت عملی نوشته ، اجرا کنید و نتیجه را ببینید تا یادگیری بهتر و سریعتری داشته باشید و همچنین وب سایتی بهینه

 

جاوا اسکریپت زبان برنامه نویسی HTML و طراحی وب است

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

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

 

.جاوا اسکریپت یکی از 3 زبانی است که همه توسعه دهندگان وب باید یاد بگیرند

    1.  HTML برای تعریف محتوای صفحات وب
    2.  CSS برای مشخص کردن طرح صفحات وب
    3.  جاوا اسکریپت برای مشخص کردن رفتار صفحات وب
 

 

1. جاوا اسکریپت می تواند محتوای HTML را تغییر دهد :
 
یکی از روش های دسترسی به المان های داخل html گرفتن id با استفاده از متد () getElementById می باشد.

این مثال از این روش برای پیدا کردن یک عنصر html با "id="demo  استفاده کرده و محتوای درون عنصر را به Hello JavaScript تغییر می دهد.

document.getElementById("demo").innerHTML = "Hello JavaScript";

مثال :

 

<body>

    <form id="form1" runat="server">

         <h1>What Can JavaScript Do?</h1>

         <p id="demo">JavaScript can change HTML content.</p>

         <button type="button"

            onclick="document.getElementById('demo').innerHTML = 'Hello JavaScript!'">

            Click Me!</button>

    </form>

</body>
 
 
2. جاوا اسکریپت می تواند ویژگی های HTML را تغییر دهید
 
این مثال با استفاده از جاوا اسکریپت ، خصوصیت src از تگ <img > یک تصویر HTML  را تغییر می دهد .
 

<body>

    <form id="form1" runat="server">

        <img src="pic_bulboff.gif" onclick="changeimg()" width="100" height="150"  id="myImage" />

        <script>

            function changeimg() {

                var image = document.getElementById('myImage');

                if (image.src.match("bulbon")) {

                    image.src = "pic_bulboff.gif";

                }

                else { image.src = "pic_bulbon.gif" }

            }

        </script>

    </form>

</body>
 
اجرا :

6360021531669198831.png

 قبل از کلیک

6360021533038277142.png

بعد از کلیک 

                                                                                                         

 
3. جاوا اسکریپت می تواند سبک ها یا استایل های (CSS) ، HTML را تغییر دهید 

در مثا ل زیر با استفاده از جاوا اسکریپت ،سبک یک عنصر  html را تغییر می دهیم

document.getElementById("demo").style.fontSize = "25px";

مثال :

<body>

    <form id="form1" runat="server">

        <p id="demo">JavaScript can change the style of an HTML element.</p>

        <button type="button" onclick="myFunction()">Click Me!</button>

        <script>

            function myFunction()

            {

                var x = document.getElementById('demo');

                x.style.fontSize = "25px";

                x.style.color = "red";

            }

        </script>

       

    </form>

</body>

 

4. جاوا اسکریپت می تواند داده ها را  اعتبارسنجی (Validate ) کند

جاوا اسکریپت اغلب برای اعتبار سنجی ورودی ها استفاده می شود

مثال :

<body>

    <form id="form1" runat="server">

        <input id="numb" />

        <button type="button" onclick="myFunction()">Submit</button>

        <p id="demo"></p>

        <script>

            function myFunction() {

                var x, text;

                x = document.getElementById('numb').value;

                if(isNaN(x) || x<1 || x>10)

                {

                    text = "Input not valid";

                }

                else

                {

                    text = "Input OK";

                }

                document.getElementById('demo').innerHTML = text;

            }

        </script>

    </form>

</body>

اجرا :

 

 

                              6360021446982755043.png6360021447749598904.png

 

پایان قسمت اول

منابع : http://www.w3schools.com/js/default.asp

 

کانون تبلیغاتی افراگرافیک

 

 آدرس: تهران-میدان انقلاب-خ آزادی-خ اسکندری-نبش کلهر-دفتر افرا گرافیک

 

66912056  66562677 66120698   09122246022

 

http://afragraphic.ir

 

info@afragraphic.ir

 

https://telegram.me/afragraphic_ir

 

http://instagram.com/afragraphic1390

 

http://facebook.com/AfraGraphic

 

http://plus.google.com/104048725792771050756

 

http://youtube.com/channel/UCOKVgQfCKUC0F4z2hoOOhPQ

 

http://twitter.com/afragraphic

 

http://ir.linkedin.com/in/afragraphic

 

http://aparat.com/afragraphic

 

http://Telegram.me/afragraphic_ir

 

http://cloob.com/name/afragraphic

 



:: برچسب‌ها: آموزش JavaScript , آموزش جاوااسکریپت , جاوااسکریپت , طراحی سایت , طراحی وب سایت , طراحی سایت , بهینه سازی سایت ,
|
امتیاز مطلب : 0
|
تعداد امتیازدهندگان : 0
|
مجموع امتیاز : 0