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

از ویکی کد
پرش به ناوبری پرش به جستجو
دورهٔ آموزشی جاوااسکریپت
Javascript.jpg
جاوااسکریپت
موارد آموزشی
۱آموزش جاوااسکریپت
۲مقدمه‌ای بر جاوااسکریپت
۳قوانین و اصول اولیه زبان جاوااسکریپت
۴خروجی جاوااسکریپت
۵عبارت‌ها در جاوااسکریپت
۶شیوهٔ نوشتن دستورات در جاوااسکریپت
۷نظرات یا کامنت‌ها (Comments) در جاوااسکریپت
۸متغیرها در جاوااسکریپت
۹عملگرهای جاوااسکریپت
۱۰عملگرهای ریاضی در جاوااسکریپت
۱۱عملگرهای مقداردهی در جاوااسکریپت
۱۲انواع داده‌ها در جاوااسکریپت
۱۳توابع در جاوااسکریپت
۱۴اشیاء (object) در جاوااسکریپت
۱۵رویدادها در جاوااسکریپت
۱۶رشته‌های متنی (string) در جاوااسکریپت
۱۷متدهای نوع داده متنی یا رشته‌ای در جاوااسکریپت
۱۸اعداد در جاوااسکریپت
۱۹متدهای داده‌های عددی در جاوااسکریپت
۲۰آرایه‌ها در جاوااسکریپت
۲۱متدهای آرایه در جاوااسکریپت
۲۲مرتب‌سازی آرایه‌ها در جاوااسکریپت
۲۳متدهای پیمایش آرایه در جاوااسکریپت
۲۴اشیاء تاریخ و زمان در جاوااسکریپت
۲۵فرمت‌های تاریخ و زمان در جاوااسکریپت
۲۶متدهای دریافت تاریخ و زمان در جاوااسکریپت
۲۷متدهای تنظیم زمان و تاریخ در جاوااسکریپت
۲۸شی ریاضی (Math) در جاوااسکریپت
۲۹ایجاد عدد تصادفی در جاوااسکریپت
۳۰مقادیر بولین (Booleans) در جاوااسکریپت
۳۱عملگرهای منطقی و مقایسه‌ای در جاوااسکریپت
۳۲ساختار if else و else if در جاوااسکریپت
۳۳تکه کد Switch در جاوا اسکریپت
۳۴حلقه For در جاوااسکریپت
۳۵حلقه While در جاوااسکریپت
۳۶کلمات کلیدی Break و Continue در جاوااسکریپت
۳۷تبدیل نوع داده‌ها در جاوااسکریپت
۳۸عملیات‌های بیتی در جاوااسکریپت
۳۹عبارات با قاعده در جاوااسکریپت
۴۰خطاها در جاوااسکریپت - رخ دادن خطا و رفع آن
۴۱Scope در جاوااسکریپت
۴۲Hoisting یا جا به جایی کدها در جاوااسکریپت
۴۳استفاده از مد یا حالت سخت‌گیرانه (use strict) در جاوااسکریپت
۴۴کلمه کلیدی This در جاوااسکریپت
۴۵کلمه کلیدی Let در جاوااسکریپت
۴۶ثابت‌ها در جاوااسکریپت
۴۷تعریف توابع به صورت پیکان
۴۸کلاس‌ها در جاوااسکریپت
۴۹اشکال‌زدایی در جاوااسکریپت
۵۰راهنمای استایل و استانداردهای کدنویسی در جاوااسکریپت
۵۱بهترین تمرینات جاوااسکریپت
۵۲اشتباهات رایج در برنامه‌نویسی جاوااسکریپت
۵۳کارایی در جاوااسکریپت
۵۴کلمات رزرو شده در جاوااسکریپت
۵۵ورژن‌های جاوااسکریپت
۵۶ECMAScript 5 - JavaScript 5
۵۷ECMAScript 6 - ECMAScript 2015
۵۸جیسون (JSON) در جاوااسکریپت
فرم‌ها
۱فرم‌ها در جاوااسکریپت
۲API ارزشیابی در جاوااسکریپت
اشیاء (object) در جاوااسکریپت
۱تست
۲تست
۳تست
۴تست
۵تست
۶تست
۷تست
JS Functions
۱تست
۲تست
۳تست
۴تست
۵تست
۶تست
JS HTML DOM
۱تست
۲تست
۳تست
۴تست
۵تست
۶تست
۷تست
۸تست
۹تست
۱۰تست
۱۱تست
۱۲تست
۱۳تست


روش‌های نمایش خروجی در جاوااسکریپت

زبان جاوااسکریپت می‌تواند داده‌ها را در روشهای گوناگونی «نمایش» دهد: [۱]

نمایش در قالب یک عنصر HTML با استفاده از​innerHTML​.

نمایش در خروجی فایل HTML با استفاده از دستور​document.write()​.

نمایش در قالب یک پنجره هشدار، با استفاده از دستور​window.alert()​.

نمایش درون پنجره کنسول مرورگر با استفاده از دستور​console.log()​.

استفاده از innerHTML

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

هر عنصر HTML خاصیتی با نام شناسه (​id​) دارد که می‌توان به وسیله مقدار آن خاصیت به آن عنصر دسترسی پیدا کرد. ویژگی​innerHTML​محتوای عناصر HTML را مشخص می‌کند.

Example
<!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>
تغییر دادن مقدار ویژگی innerHTML یک عنصر HTML راهی مناسب برای نمایش داده‌ها در HTML است.

استفاده از ()document.write

برای اهداف آزمایشی و تست، معمول است که از دستور​document.write()​استفاده می‌کنند.

Example
<!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 به طور کامل لود شد موجب می‌شود تا برای نمایش داده‌ها، داده‌هایی که در حال نمایش به کاربر هستند پاک شده و سپس محتوای مد نظر شما نمایش داده شود:
Example
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<button type="button" onclick="document.write(5 + 6)">Try it</button>

</body>
</html>
متد​document.write()​فقط باید برای عمل تست استفاده شود.

استفاده از دستور ()window.alert

شما می‌توانید از یک پنجره هشدار برای نمایش داده‌های خود استفاده کنید:

Example
<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
window.alert(5 + 6);
</script>

</body>
</html>

استفاده از دستور ()console.log

برای اهداف اشکال زدایی یا Debug شما می‌توانید از متد​console.log()​برای نمایش داده استفاده کنید.

شما در فصل‌های آینده در مورد عمل اشکال زدایی یا Debug مطالب بیشتری را خواهید آموخت.
Example
<!DOCTYPE html>
<html>
<body>

<script>
console.log(5 + 6);
</script>

</body>
</html>

منابع آموزشی