روشهای نمایش اطلاعات در خروجی در زبان جاوا اسکریپت
دستورات ورودی و خروجی در زبان برنامه نویسی جاوا اسکریپت
انواع روشهای نمایش اطلاعات در خروجی
همان طور که می‌دانیم تا کنون ما از دستود alert برای نمایش اطلاعات در خروجی استفاده می‌کردیم. این دستور یا تابع از کلاس window بوده که شکل صحیح استفاده از آن به این روش است که ابتدا نام کلاس را نوشته و سپس نام تابع را می‌نویسیم. البته دستور alert بدرون نوشتن نام کلاس نیز کار می‌کند.
window.alert("darsman.com");
alert("darsman.com");
دستور log
اگر نیاز باشد که در روند برنامه یک مقدار را به تعداد زیادی در خروجی نمایش دهیم، دیگر دستور alert گزینه مناسبی نخواهد بود. زیرا برنامه چندین بار پنجره حاصل از دستود alert را نمایش می‌دهد و این اتفاق خوبی نیست.
اگر از دستور log که از کلاس console است استفاده کنیم، خروجی را در قسمت Console مرورگر خواهیم دید. برای باز کردن قسمت Console مرورگر وب باید روی صفحه مرورگر کلیک راست کرده و گزینه Inspect Element را انتخاب کنیم و در پنجره باز شده، زبانه Console را انتخاب کنیم.
console.log("darsman.com");
این دستور می‌تواند رشته‌ها، اعداد و حتی مقادیر منطقی را در خروجی نمایش دهد.
\n_h4 و \t
در هنگام نمایش اطلاعات در خروجی، همه کاراکترهایی که درون "" نوشته می‌شوند نمایش داده می‌شود، اما بخی عبارات محدود وجود دارد که نمایش داده نمی‌شود و در عوض عملیاتی را انجام می‌دهد. برای مثال اگر درون "" و در بین رشته یا متن از \n استفاده کنیم، مارا به خط بعدی می‌برد.
alert("darsman\n.com");
یکی دیگر از این عبارات \t بوده که در بین کاراکترهای قبل و بعد خود فاصله ایجاد می‌کند.
alert("darsman\t.com");
دستور write
دستور یا تابع write که از کلاس document است یکی دیگر از راه‌های نمایش اطلاعات در خروجی به شمار می‌رود. توجه داشته باشید که این دستور اطلاعات را درون صفحه نمایش می‌دهد و همچنین از عباراتی مانند \n و \t پشتیبانی نمی‌کند. برای اعمال عملیات‌هایی مانند رفتن به خط بعد یا ایجاد فاصله، باید از دستورات html استفاده کنید.
document.write("darsman<br>.com");
مانند دستور log و alert، این دستور نیز قادر به نمایش رشته‌ها، اعداد و مقادیر منطقی می‌باشد.
دستور getElementById
به کمک دستود getElementById که یکی از تابع‌های کلاس document است، میتوانیم به عناصر و تگهای درون صفحه دسترسی پیدا کنیم. برای انجام این کار باید مقدار آی دی تگ مورد نظر را درون پرانتز دستور getElementById بنویسیم.
<p id="ID">
darsman.com
</p>
<script>
document.getElementById('ID');
</script>
دستور innerText
حال که به تگهای درون صفحه دسترسی داریم، میتوانیم درون آنها تغییراتی را اعمال کنیم. با استفاده از دستور innerText میتوانیم متن تگ مورد نظر را تغییر دهیم.
<p id="ID">
darsman.com
</p>
<script>
document.getElementById('ID').innerText="MehdiAbbasi";
</script>
دستور innerHTML
دستور بعدی که برای تغییر بر روی تگهای html استفاده می‌شود، دستور innerHTML است. تنها تفاوتی که این دستود با دستود innerText دارد این است که اگر درون آن در کنار متن، از تگها html نیز استفاده شود، این دستور آنها را اجرا کرده و مانند متن با آن برخورد نمی‌کند.
<p id="ID">
darsman.com
</p>
<script>
document.getElementById('ID').innerHTML="MehdiAbbasi<hr>";
</script>
دستور value
به کمک دستور value می‌توان محتوای همه‌ی تگهایی که صفت value دارند را تغییر داد.
<input type="text" id="TXT" value="1398">
<script>
document.getElementById('TXT').value=0;
جلسات دوره
مدرس :
مهدی عباسی
مهدی عباسی هستم، مسلط به حداقل ۲۰ زبان مطرح برنامه نویسی به صورت پیشرفته، مدیر عامل شرکت آریا نرم افزار و بنیانگذار آکادمی درسمن، مسلط به تدریس دروس تخصصی کاردانی و کارشناسی کامپیوتر، پایگاه داده ها، برنامه نویسی پیشرفته، مبانی برنامه نویسی، مباحث ویژه طراحی وب و .... مطالعه بیشتر رزومه
نظر شما در تصمیم دیگران اثرگذار است.
لطفا برای همراهان درسمن و بهتر شدن دوره نظر خود را بنویسید.