اموزش برنامه نویسی java script
سلام خیلی وقته هیچ اموزشی منتشر نکردیم!
تو این اموزش میخوایم ی کارای کوچیکی با جاوا اسکریپت انجام بدیم..
خب ما به فرض میخوایم ی سایت حرفه ای بسازیم که به کاربرامون این امکان رو بده تا بتونن بدون داشتن دانش برنامه نویسی برای خودشون ی سایت بسازن!
خب اول از همه برای اینکه کارمون راحت شه باید کتابخانه های جاوا اسکریپت رو به سورس کدمون اضافه کنیم… که به دو صورت امکان پذیره یک اینکه کتابخانه رو از گوگل دانلود کنیم و بریزیم تو فایل سایتمون و ازش استفاده کنیم و راه دوم اینکه ما ازش به صورت انلاین استفاده کنیم ینی فقط ادرس کتابخانه رو به صفحمون اضافه کنیم خب حالا چجوری این کارو انجام بدیم!
ما باید ادرس کتابخانه رو در بخش src که مخفف source هست قرار بدیم
اگه از کتابخانه انلاین استفاده میکنیم url رو اضافه میکنیم یا اگه کتابخانه رو دانلود کردیم ادرس پوشه و اسم کتابخانه رو به src میدیم… مثلا اگه کتابخانه توی پوشه js باشه و اسم فایلمونم به عنوان مثال query.js باشه باید این ادرس رو به src بدیم js/query.js فراموش نکنید که فایل js باید کنار فایل سایتمون باشه
12<script src=""> <script src="js/query.js">
اینم کدای سایتی که به صورت پیش فرض برای سایتی کاربر میسازه در نظر میگیریم
1<!DOCTYPE html>
1<html lang="fa" dir="rtl">
1 <head>
1 <meta charset="utf-8">
1 <title></title>
1 </head>
1 <body>
1
1 </body>
1</html>
خب ما برای شروع یک ورودی <input> به کاربر میدیم و میگیم title سایت رو انتخاب کنه و میخوایم هر چیزی که کاربر تو این ورودی نوشت بشه تایتل سایت ما.. ی ورودی با ای دی title لازم داریم
1<input type="text" id="title" name="" value="">
خب این ایدی به ما کمک میکنه تا بتونیم مقدار وارد شده توسط کاربر رو از ورودی بگیریم!
حالا میریم سراغ بخش جذاب جاوا اسکریپت…
1 <script type="text/javascript">
1 $(document).ready(function(){
1 $('#title').keyup(function(){
1 var title = document.getElementById('title').value;
1 document.title = title;
12 }) })
1
خب میریم سر توضیح این کد..
12345 <script type="text/javascript"> $(document).ready(function(){ })
تو این قسمت ما به ادیتور میفهمونیم که میخوایم کد جاوا اسکریپت رو شروع کنیم!
12$('#title').keyup(function(){ var title = document.getElementById('title').value;
12 document.title = title; })
تو این قسمتم گفتیم وقتی که کاربر ی کلمه تایپ کرد ی متغیر با اسم title بساز و مقدار ورودی رو بهش بده و توی خط پایینم تایتل صفحه رو انتخاب کردیم و مقدارشو برابر با متغیر title قرار دادیم به همین راحتی..
اگه مشکلی داشتین تو بخش کامنتا بگین ما کمکتون میکنیم…