آموزش متد insertAdjacentHTML در DOM جاوااسکریپت

سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش متد insertAdjacentHTML در DOM جاوااسکریپت با من همراه باشید.

متد insertAdjacentHTML در DOM جاوااسکریپت

Free-Learn

متد insertAdjacentHTML در DOM جاوااسکریپت

با استفاده از متد ()insertAdjacentHTML میتونیم یک محتوای HTML ( که با استفاده از دستورات HTML مشخص شده ) را در یک مکان مشخص شده قرار دهیم.

این متد ۲ پارامتر میگیره، پارامتر اول مکان قرار گیری را مشخص میکند و پارامتر دوم اون محتوای HTML که قرار است در مکان مشخص شده قرار بگیرد.

Free-Learn

مثال از این متد

در ادامه میتوانید یک مثال از این متد را در زبان جاوا اسکریپت مشاهده نمایید.

مثال شماره ۱ : با کلیک بروی یک دکمه ، یک تگ h2 با محتوا و کلاس مشخص شده بعد از عنصر مورد نظر ما قرار میگیره.

امتحان کنید

مثال شماره ۲ : استفاده از ۴ مقدار ( afterbegin و afterend و beforebegin و beforeend )

امتحان کنید

Free-Learn

پشتیبانی مرورگرها

در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از این متد در جاوااسکریپت پشتیبانی میکنند یا خیر.

نام متد Chrome Firefox Opera Safari IE
()insertAdjacentHTML ۱ ۸ ۷ ۴ ۴

Free-Learn

شکل نوشتاری

نحوه نوشتن یا استفاده یا سینتَکس (Syntax) این متد در جاوااسکریپت بصورت زیر می باشد.

Free-Learn

جدول پارامترها

در جدول زیر میتوانید، پارامترهایی را که میتوان در این متد استفاده کرد مشاهده نمایید.

مقدار توضیح
Position ضروری – موقعیت یا مکان قرار گیری محتوا را مشخص میکند
تنها مقادیر زیر قابل قبول می باشد
afterbegin : در داخل عنصر، به عنوان فرزند اول قرار میگیره
afterend : کلا بعد از عنصر قرار میگیره
beforebegin : در داخل عنصر، به عنوان فرزند آخر قرار میگیره
beforeend : کلا قبل از عنصر قرار میگیره
HTML_CONTENT ضروری – اون محتوایی که قراره انتقال داده شه.

Free-Learn

نکات و توضیحات

  • مقدار afterbegin محتوای HTML مورد نظر رو به داخل عنصر و به عنوان فرزند اول اضافه میکنه ولی مقدار beforebegin محتوای HTML مورد نظر رو به داخل عنصر و به عنوان فرزند آخر اضافه میکنه.

Free-Learn

دریافت PDF یا پرینت این مطلب