کار با innerHTML در جاوا اسکریپت
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش کار با innerHTML در جاوا اسکریپت با من همراه باشید.
Free-Learn
کار با innerHTML در جاوا اسکریپت
ویژگی innerHTML یکی از پرکاربردترین ویژگی های موجود در جاوا اسکریپت می باشد که با استفاده از این ویژگی میتونیم محتوای موجود در یک عنصر رو دریافت، تغییر و ایجاد نماییم.
یعنی در یه کلام ، اگه خواستیم محتوایی رو داخل یک تگ قرار بدیم یا برعکس اگه خواستیم محتوای یک تگ رو بدست آوریم میتونیم به راحتی با استفاده از ویژگی innerHTML اینکارو انجام بدیم.
مثال شماره ۱ : ریختن محتوای جدید در تگ h2
|
1 2 3 4 5 6 |
<script> var b = document.getElementById("result"); b.innerHTML ="سلام خوبی؟"; </script> |
مثال شماره ۲ : دریافت محتوای تگ h2 و سپس ریختن همون محتوا در درون یک تگ h2 دیگر
|
1 2 3 4 5 6 7 |
<script> var a = document.getElementById("test"); var b = document.getElementById("result"); b.innerHTML = a.innerHTML; </script> |
مثال شماره ۳ : حذف یا خالی کردن محتوای موجود در یک عنصر
|
1 2 3 4 5 6 7 8 |
<script> function del(){ var a = document.getElementById("test"); a.innerHTML = ""; } </script> |
مثال شماره ۴ :دریافت عنوان صفحه ( یا تگ Title ) ( که در تب مرورگر می باشد ) و نمایش در یک تگ
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<!DOCTYPE html> <html> <head> <title id="My_Title">سایت آموزشی فری لرن</title> </head> <body> <p>عنوان صفحه برابر است با : <span id="result"></span></p> <script> var a = document.getElementById("result"); var b = document.getElementById("My_Title");; a.innerHTML = b.innerHTML; </script> </body> </html> |
