آموزش innerhtml در جاوا اسکریپت
در آموزش های جاوا اسکریپت یکی از مهم ترین قسمتی که لازم است با آن آشنا شوید innerhtml است در این مقاله به بررسی این موضوع پرداخته ایم
جاوا اسکریپت کلیه صفحات html را به عنوان document می شناسد و اگر بخواهید رشته های یک المنت را بدست بیاورید یا در آن ویرایشی انجام دهید حتماً باید از کلمه document استفاده کنید
برای مثال یک تگ p را در نظر بگیرید می خواهیم زمانی که کاربر روی یک دکمه کلیک کرد یک متنی را داخل تگ p قرار دهد.
بنابراین به صورت زیر باید عمل کنید
- ابتدا یک سند html باز کنید
- سپس یک تگ p در آن قرار دهید و برای آن، باید یک شناسه تعیین کنیم در ادامه معرفی خواهم کرد
- سپس یک دکمه در سند قرار دهید
id چیست؟
در بحث css گفتیم که id ها به عنوان یک شناسه در سند html مورد استفاده قرار می گیرند و اگر یک شناسه ای را به عنصری اختصاص دهیم دیگر آن شناسه را نمی توانیم به عنصر دیگر اختصاص دهیم
<body> <p id="p1"></p> <br/> <input type="button" value="ClickMe"> </body>
کد مربوط به نمایش پیام
<script>
function Message(){
document.getElementById('p1').innerHTML="سلام به جاوا اسکریپت خوش آمدید";
}
</script>
در مثال فوق دستورات مربوط به نمایش پیام را داخل یک تابعی به نام Message قرار دادیم و این کد زمانی اجرا خواهد شد که کاربر روی دکمه کلیک کند پس بنابراین تابع message را در رویداد کلیک دکمه فرخوانی می کنیم
بشکل زیر
<input type="button" value="ClickMe" onClick="Message()">
دیدگاهتان را بنویسید