همیشه فرآیند تفکر نقادانه با روشن‌سازی مفاهیم آغاز می‌شود. SEE-I یک روش بسیار کارآمد برای روشن سازی است. این حروف مخفف چهار مرحله‌ای هستند که کمک می‌کنند، ایده‌ی کلیدی شما برای دیگران دقیقا روشن شود: (بیشتر…)

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

ورژن جدید OBS Studio 26 منتشر شده است و در دسترس است. در این ورژن نرم افزار تغییرات بسیار جالبی کرده است؛ مانند پشتیبانی از دوربین مجازی، افزودن نوار ابزار و … در این نوشتار می‌خواهیم به برخی از آنها بپردازیم. (بیشتر…)

1. مقدمه
   • تاریخچه
   • جاواسکریپت چه کارهایی می‌تواند انجام دهد؟
   • برنامه یا اسکریپت
   • شیءگرا
   • مدل آبجکت در بروزر
   • رویدادگرا
   • چگونه جاواسکریپت بنویسیم؟
2. سینتکس (Syntax)
   • قواعد دستور زبان – Syntax
   • آغاز کار در جاواسکریپت
   • آبجکت window
   • آبجکت console
   • آبجکت document
3. فرم (Forms)
   • form
   • button
   • input
   • label
4. دیتا (Data)
   • نگهداری دیتا
     • متغیر
     • ثابت
   • انواع دیتا – Data Types
     • ساده (Primitive)
       • عدد (Numbers)
       • رشته (Strings)
       • منطقی (Boolean)
     • مرکب (Composite)
       • شیء (Objects)
       • آرایه (Arrays)
       • تابع (Functions)
     • بی‌ارزش (Trivial)
       • تهی (null)
       • نامعین (undefined)
   • تبدیل دیتا
5. اکسپرشن (Expressions)
   • آپریتورهای استرینگ
   • آپریتورهای حساب
   • آپریتورهای بولین
   • آپریتورهای مقایسه‌ای
   • الویت آپریتورها
   • آبجکت Number
6. کاندیشن۱ (Conditions)
   • تِرنِری – Ternary (?)
   • شرط if
   • اسکوپ – Scope
   • آبجکت Math
7. کاندیشن۲ (Conditions)
   • سوئیچ – Switch
   • آبجکت String
8. فانکشن (Functions)
   • نوع ۱
   • نوع ۲
9. ایونت (Events)
   • روش ۱
   • روش ۲
   • روش ۳
   • ایونت‌های ماوس
10. لوپ (Loops)
    • حلقه do
    • حلقه while
    • حلقه for
    • break
    • continue
11. آرایه (Arrays)
    • تعریف
    • فانکشن
12. سلکت

برای کار بر روی بخشی از صفحه وب، باید ابتدا آن بخش را پیدا کرد. سپس با پراپرتی‌ها یا متدهای آن کار کرد.

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

• getElementById
• getElementsByName
• getElementsByTagName
• getElementsByClassName
• querySelector
• querySelectorAll

یافتن المنت با id

متد getElementById پرکاربردترین متد جاواسکریپت است. در فایل HTML هر المنت می‌تواند id داشته باشد. و همیشه id باید در هر فایل یکتا باشند. به زبان دیگر در یک فایل HTML دو المنت نمی‌توانند یک id مشترک داشته باشند. بنابر این هر getElementById تنها یک المنت را می‌گیرد.

<h1 id="hi">Hello World!</h1>

const hi = document.getElementById('hi');

یافتن المنت‌ها با اتریبیوت name

متد getElementsByName بر اساس اتریبیوت name در المنت‌های HTML عمل می‌کند. در فایل HTML هر المنت می‌تواند یک name داشته باشد. ولی name لازم نیست، یکتا باشند. یعنی در یک فایل HTML دو یا چند المنت می‌توانند یک name یکسان داشته باشند. و getElementsByName یک آرایه از المنت‌ها را می‌گیرد.

به حرف s در Elements توجه کنید. که همه المنت‌ها، با آن name را شامل می‌شود. این آرایه از اندیس صفر برای اولین المنت شروع می‌شود و به تعداد المنت‌های با آن name ادامه پیدا می‌کند.

<input type="text" name="firstname">

const fname = document.getElementsByName('firstname')[0];

یافتن المنت‌ها با تگ HTML

متد getElementsByTagName بر اساس Tag المنت‌های HTML جستجو می‌کند. در فایل HTML هر المنت یک Tag دارد. و getElementsByTagName یک آرایه از المنت‌ها را می‌گیرد.

به حرف s در Elements توجه کنید. که همه المنت‌ها، درون آن Tag را شامل می‌شود. این آرایه از اندیس صفر برای اولین المنت شروع می‌شود و به تعداد المنت‌های با آن Tag ادامه پیدا می‌کند.

<h1>Hello World!</h1>

const hi = document.getElementsByTagName('h3')[0];

یافتن المنت‌ها با کلاس

متد getElementsByClass بر اساس Class المنت‌های HTML جستجو می‌کند. در فایل HTML هر المنت می‌تواند یک Class داشته باشد. و getElementsByClass یک آرایه از المنت‌ها را می‌گیرد.

به حرف s در Elements توجه کنید. که همه المنت‌ها، که دارای آن Class هستند، را شامل می‌شود. این آرایه از اندیس صفر برای اولین المنت شروع می‌شود و به تعداد المنت‌های با آن class ادامه پیدا می‌کند.

<h1 class="title">Hello World!</h1>

const hi = document.getElementsByClass('title')[0];

یافتن المنت با سلکتور CSS

متد querySelector بر اساس سلکتور CSS المنت‌ها در HTML جستجو می‌کند. و querySelector اولین المنت که با شرایط سلکتور هماهنگ باشد را می‌گیرد.

<h1 class="title">Hello World!</h1>

const hi = document.querySelector('h1.title');

یافتن المنت‌ها با سلکتور CSS

متد querySelectorAll بر اساس سلکتور CSS المنت‌ها در HTML جستجو می‌کند. و querySelectorAll یک آرایه از المنت‌هایی که با شرایط سلکتور هماهنگ باشد را می‌گیرد.

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

<h1 class="title">Hello World!</h1>

const hi = document.querySelectorAll('h1.title')[0];