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

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

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

در این بخش قرار است از یک فرم html ورودی دریافت کنیم. در مثال ها انواع رویداد ها (event) را نیز بررسی می کنیم.

ما برای مثال های خود دو فایل ایجاد می کنیم:

• index.html
• script.js

ادامه ی مطلب را ببینید.

یکی از کار هایی که در سئوی سایت بسیار تاثیر گذار است ، لینک های داخلی است. و اگر این لینک های داخلی به قسمت مشخصی از صفحه متصل باشند کاربر احساس رضایت بیشتری می کند و رتبه ی گوگل را بالاتر می برد.

برای ایجاد لینک داخلی به قسمت خاصی از صفحه (مثلا عنوانی که در وسط صفحه قرار دارد) باید به آن قسمت از صفحه id خاصی نسبت داده شود و در نوار آدرس مرورگر با علامت #id به لینک رجوع شود.

اگر شما بخواید برای همه ی عنوان های سایتتون به این شکل لینک بذارید ، خیلی وقت گیره. (مگر این که از اول این کار رو کرده باشید )

پس پیشنهاد می کنم از این ابزار خیلی باحال استفاده کنید تا به یه چشم به هم زدن همه ی عنوان هایی که می خواید لینک گذاری بشن.

برای دریافت کد ابزار به ادامه ی مطلب بروید.

بعد از یه وقفه ی چند روزه بالاخره اومدم با یه مطلب خیلی عالی.

اگر مطلب قبلی را نخوانده اید ، بخوانید!

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

در این مطلب می خواهیم کمی پیشرفته تر کار کنیم. در برنامه ای که مقدار ورودی و متغیر وجود نداشته باشد ، کار ها خیلی ساکن (static) می شوند. ما می خواهیم با افزودن مقدار ورودی و متغیر ها کار خود را کمی پویا تر کنیم.

به ادامه ی مطلب بروید.

سلام. بالاخره قرار کد نویسی رو شروع کنیم! من که خیلی ذوق دارم. شما چطور؟

من بیشتر دوست دارم برنامه نویسی را با آوردن مثال آموزش دهم. این مثال ها را دنبال کنید.

در مورد چگونگی اجرای کد قبلا در این مطلب توضیح داده ام.

نمایش یک پیغام ساده

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

برای خواندن مطلب به طور کامل به ادامه ی مطلب بروید.

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

این مطلب ادامه ی دو مطلب قبلی است:

• مقدمه
• اجرای کد ها
  

برای مطالعه ی مطلب به ادامه ی مطلب بروید.

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

در هر برنامه نویسی ای ، ما چیزی با عنوان syntax (سینتکس) داریم. این syntax را می توان تقریبا دستور زبان برنامه نویسی معرفی کرد. یعنی این که syntax به ما می گوید که چطور باید کد ها را بنویسیم و چطور از امکانات زبان برنامه نویسی استفاده کنیم. پس خیلی مهم است که با syntax هر برنامه نویسی آشنا شوید تا در نوشتن کد ها به خطا بر نخورید. syntax آموزش خاصی ندارد. شما با یاد گرفتن بخش های مختلف کدنویسی هر زبان ، با آن آشنا می شوید.

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

• index.html
• scripts.js

برای مطالعه ی مطلب به ادامه ی مطلب بروید.

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

هر کاراکتر در کامپیوتر با عددی مشخص می شود که آن عدد همان کد کاراکتر است. در اصل کامپیوتر کاراکتر ها را فقط با عدد آن ها می شناسد و نمی داند مثلا حرف "a" چیست. بلکه می داند عدد آن 97 است. جالب تر این که کامپیوتر حتی همین 97 را هم نمی شناسد و با اعداد دودویی آن را تشخیص می دهد.

کد کاراکتر چیست؟

تمام کاراکتر هایی که ما استفاده می کنیم ، در جدول هایی بسیار بزرگ جمع آوری شده اند و به صورت قراردادی این کد ها به آن ها تعلق گرفته است که وقتی ما صفحه ای پر از کاراکتر را می بینیم ، کامپیوتر برای نمایش تمام این کاراکتر ها از آن جدول ها استفاده می کند. سیستم ها به طور پیشفرض از جدول ascii برای نمایش کاراکتر ها استفاده می کنند که جدول بسیار محدودی است و بسیاری از کاراکتر هایی که شاید به درد ما بخورند ، از جمله حروف فارسی را ندارند. اگر شما می توانید الان این حروف فارسی را ببینید به خاطر این است که کامپیوتر شما از جدولی به غیر از این جدول استفاده کرده است. جدول utf-8 جدولی کامل تر است که به دلیل استفاده از اعداد در مبنای 16 ، ظرفیت بسیار بیشتری دارد. این جدول شامل حروف فارسی و بسیاری کاراکتر های دیگر نیز هست.

در مطلبی ، خبر انتشار بازی رمزگشایی را به کاربران دادم. گفتم که این بازی ، مربوط به برنامه نویسی و امنیت است. قرار بود در مورد آن آموزش هایی قرار دهم تا افراد مبتدی هم بتوانند آن را بازی کنند. امروز در این مطلب می خواهم در مورد مرحله ای اول این بازی توضیحاتی بدهم و روش بردن مرحله ی اول را توضیح دهم.

نکته: برای اجرای کد های جاوا اسکریپت می توانید از کنسول موجود در مرورگر خود استفاده کنید. برای این کار F12 را بزنید و در قسمت console کد جاوا اسکریپت را وارد کنید و نتیجه را ببینید.

نکته: برای اجرای کد های C# می توانید از نرم افزار visual studio استفاده کنید.

برای ورود به بازی روی لینک زیر کلیک کنید:

بازی رمزگشایی

مرحله ی یک بازی رمزگشایی

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

ما در برنامه نویسی ، عملگر های ساده ای مثل جمع ، منها ، ضرب و تقسیم و ... داریم. به جز این عملگر های ساده که عملگر های پایه ی ریاضی هستند ، عمگلر های دیگری هم وجود دارند که کار آن ها با توجه به اعداد دو دویی (binary) است.

کاربرد عملگر های بیتی

کاربرد اصلی عملگر ها همین انجام اعمال بیتی روی اعداد است. یک برنامه نویس می تواند با استفاده از این عملگر های روی بیت های کاراکتر های برنامه ی خود تغییراتی ایجاد کند و به این شکل آن را از دید دیگران مخفی کند (مبهم یا رمزگذاری کند) (برای مطالعه درباره ی obfuscation و encryption اینجا کلیک کنید)

در دو مطلب قبلی ای که در سایت منتشر شد ، من سعی کردم تا حدودی کاربران را با رمزگذاری (encryption) و مبهم کردن (obfuscation) آشنا کنم.

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

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

مقدمه ای بر رمزگذاری و مبهم کردن کد

امروز با بازی رمزگشایی در سایت ابزارها قالب میزبان شما هستیم. این بازی نمونه ی ایرانی ندارد. از این به بعد باید منتظر بازی های تحت وب این چنینی از سایت ما باشید.

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

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

هر کسی که تا به حال کد جاوا اسکریپت نوشته باشد ، می داند که این زبان open source (منبع باز) است. منبع باز بودن یک زبان برنامه نویسی هم محاسنی دارد و هم معایبی. یکی از معایب منبع باز بودن این است که همه می توانند ، کد شما را ببینند و از آن استفاده کنند و این یعنی کپی رایت هیچ معنی ای ندارد. شاید برای بعضی ها مشکلی نداشته باشد که کد هایشان را در اختیار همه بگذارند ، اما ممکن است شما دوست نداشته باشید کد هایتان برای همه قابل فهم باشد. برای حل این مشکل ما نیاز داریم کد های خود را Encryption (رمزگذاری) یا obfuscation (مبهم) کنیم.

بعد از چندین روز (تقریبا یک ماه) کار کردن روی قالب جدید سایت ابزارها قالب ، بالاخره قالب تمام شد. امروز شما سایت را با ظاهری بسیار زیباتر از قبل می بینید. مطالب هم از این به بعد زیباتر و مفید تر خواهند بود. اما همان طور که گفته بودم ، قالب قبلی سایت را در این مطلب برای استفاده ی عموم منتشر می کنم. قالبی بسیار خوب که به مدت یک سال ، به سایت ما شکل و شمایل زیبایی داده بود.

برای دانلود قالب به ادامه ی مطلب بروید.

در مطلب قبلی متدی از جی کوئری معرفی کردم به نام animate. کار این تابع در جی کوئری ایجاد انیمیشن بر روی ویژگی های سی اس اس است. در مطلب قبلی گفته بودم که امکان ایجاد انیمیشن بر روی تمام ویژگی های Css با استفاده از این تابع نیست. اما نگفتم که چه توابعی امکان انیمیشنی شدن را دارند. امروز در این مطلب می خواهم مواردی که امکان استفاده از انیمیشن را دارند بگذارم.

شکل کلی تابع animate

<<<code>>>

$(selector).animate( { "cssProperty":value , ... }, animationTime ); // time is in milisecond

<<</code>>>

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

امروز می خواهم این کدک را برایتان بگذارم که با استفاده از آن می توانید کاربر را به لینک های داخلی (یعنی لینک هایی که # دارند) با ترنزیشن اسکرول ( scroll transition ) ، یعنی به شکلی شناور ، منتقل کنید.

مقدمه

برای فهمیدن این کدک شما باید با کد های جی کوئری (JQuery) و اچ تی ام ال (HTML) آشنا باشید. از آنجایی که قرار است در کدَک از جی کوئری استفاده کنیم اول از همه ، کتابخانه ی جی کوئری را در صفحه لود می کنیم:

<<<code>>>

<script type="text/javascript" src="http://www.toolstheme.ir/js/jquery.js"></script>

<<</code>>>

می توانید قسمت قرمز رنگ (کتابخانه ی جی کوئری) را از گوگل دریافت کنید. (این لینک از گوگل است) البته کتابخانه ی جی کوئری ای که در سایت ما هم هست به روز است و می توانید از همان استفاده کنید.

برای دیدن مطلب به طور کامل به ادامه ی مطلب بروید.

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

ببخشید به خاطر این که چند وقتی هست مطلب جدید توی سایت منتشر نشده و شاید خیلی ها منتظر کد های درخواستیشون از ما بودن اما وقت نشد که پاسخشون رو دریافت کنن.

توی این مطلب فقط می خوام علت وقفه ی طولانی مدت برای انتشار مطلب جدید رو توضیح بدم. دلیل هیچ چیز نیست ، به جز درس و امتحان و مشغله و ...

البته یه چیز دیگه هم هست. قالب جدید !!!!

شاید دیگه از دیدن ظاهر سایت ما با این شکل خسته شده باشید و بخواید قالب جدیدی از سایت ابزارها قالب ببینید. امروز می خوام بهتون این خبر رو بدم که قرار همچین اتفاقی بیفته و از قالب جدید سایت پرده برداری کنم. البته این که قالب کی قراره تموم بشه و روی سایت استفاده بشه معلوم نیست. چون خیلی جزئی و دقیق داریم روش کار می کنیم. اما بالاخره یه روز آماده میشه و امروز هم می خوام این اسکرین شات رو از هدر سایت براتون به نمایش بذارم:

اطلاعات قالب

نام: hrmt theme

نسخه: 3

سال انتشار: 95

ویژگی های طراحی: واکنش گرا ، رنگ بندی حرفه ای ، کد نویسی دقیق و اصولی ، گرافیک عالی ، کاربرد ساده ، خلوت و ...

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

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

با استفاده از این ابزار شما می توانید کد های خود را رمزگذاری کنید تا همه نتوانند کد های واقعی را ببینند و از آن ها سوء استفاده کنند. البته نکته ای که وجود دارد این است که این ابزار تنها برای کد های جاوا اسکریپت نیست و شما می توانید با برداشتن تیک مربوط به کد های جاوا اسکریپت دیگر متن ها را نیز رمزگذاری کنید. (مثلا می توانید یک نام را رمزگذاری کنید )

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

قابل اجرا برای:

• هر متن یا کدی که بخواید رمزگذاری کنید
  

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

جاوا اسکریپت یک کد نویسی تحت کاربر است (برای مطالعه درباره ی برنامه های سمت سرور و سمت کاربر اینجا کلیک کنید) که توانایی های زیادی دارد و هکر ها می توانند از آن به عنوان یک ابزار برای هک کردن کاربران اینترنت استفاده کنند. البته در نظر داشته باشید که جاوا اسکریپت بسیار مفید است و در طراحی صفحات وب بسیار به درد می خورد.

قابل اجرا برای:

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

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

این مطلب به دلیل درخواست یکی از کاربران ، در سایت قرار داده شد. می خوام در این مطلب خیلی ساده و مفید توضیح بدهم که چگونه می شود یک دامنه را به وبلاگ متصل کرد. توجه داشته باشید که این مطلب می تواند خیلی مفید باشد و سطح آن به طور قابل قبولی تنظیم شده است تا به درد خیلی ها بخورد.

دامنه چیست؟

دامنه یا domain آدرسی متنی است که به آی پی هایی از اینترنت اختصاص داده می شود. اگر دامنه نبود ما برای دیدن هر سایتی مجبور بودیم آدرس آی پی آن را وارد کنیم. همان طور که می دانید آی پی ها چهار عدد هستند که با نقاطی از هم جدا می شوند (مثل 192.168.0.1) و حفظ کردن آن ها به هیچ وجه راحت نیست. اما با وجود دامین دیگر کسی لازم نیست این آی پی ها را حفظ باشد تا بتواند سایت های محبوب خود را ببیند. وبلاگ ها به جای دامنه ، زیر دامنه (sub-domain) دارند و این زیر دامنه ها را به طور رایگان به صاحب وبلاگ ها ارائه می کنند. اما اگر شما بخواید یک دامنه ی شخصی برای خود داشته باشید باید چه کار کنید؟

برای مشاهده ی مطلب به طور کامل به ادامه ی مطلب بروید.