گروه مقاله : جاوا اسكريپت Java Script
تاريخ انتشار : 1395/07/24 - 12:12
كد :7213
آموزش مقدماتی جاوا اسکریپت را با نحوه خروجی کد های جاوا اسکریپت ادامه خواهیم داد . نتیجه اجرای کد های جاوا می تواند در پنچره ها و مسیج باکس ها و ... به نمایش در آید که در این مطلب به این موضوع می پردازیم.
آموزش جاوا اسکریپت خروجی جاوا اسکریپت
امکان های نمایش جاوا اسکریپت
سطح آموزش : مقدماتی
جاوا اسکریپت می تواند داده ها را به شکل های مختلفی به نمایش در بیاورد.
-
در یک جعبه ی هشدار . (یک پنجره ی طوسی با امکان بستن و تائید کردن) ، نحوه کاربرد
window.alert().
-
در خروجی خود HTMl ،(بصورت یک متن درون خود فایل نوشته می شود. ) نحوه کاربرد.
document.write().
-
درون یک تگ Html نوشته می شود . (تگ ها یک ایدی گرفته و سپس کد جاوا به آن آیدی رجوع می کند.) نحوه ی استفاده
innerHTML.
-
در کنسول مرورگر به نمایش در می آید . کنسول را با F12 می توان فعال کرد نحوهی استفاده
console.log().
1. استفاده در ()window.alert
شما می توانید از باکس یا جعبه ی هشدار برای نمایش داده ها استفاده کنید.
مثال :
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
window.alert(5 + 6);
</script>
</body>
</html>
2.استفاده از ()document.write
مثال:
<!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 بصورت زیر میتواند تمام محتویات صفحه را پاک کند.
مثال:
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<button onclick="document.write(5 + 6)">Try it</button>
</body>
</html>
از innerHTML استفاده کنیم.
برای دسترسی به تگ های Html جاوااسکریپت می تواند از متد (document.getElementById(id استفاده کند.
ویژگی ID تگ Html را مشخص می کند. و innerHTML محتوای Html را مشخص می کند.
مثال:
<!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>
استفاده از ()console.log
شما میتوانید از این متد هم برای نمایش داده ها بهره بگیرید.
برای فعال کردن کنسول مرورگر خود کلید F12 ویا consol را از منو انتخاب کنید.
مثال:
<!DOCTYPE html>
<html>
<body>
<h1>My First Web Page</h1>
<p>My first paragraph.</p>
<script>
console.log(5 + 6);
</script>
</body>
</html>