طريقة insertAdjacentHTML() في HTML DOM

مثلث عنصر DOM HTML

insertAdjacentHTML()تعمل هذه الطريقة على تحويل النص المحدد إلى HTML، وتضيف العنصر الناتج في الموقع المحدد.

هذه الطريقة لا تقوم بتحليل العنصر الذي يستخدم حاليًا، لذا لن تؤدي إلى تدمير العناصر الموجودة داخل العنصر.

هذا يمنع الخطوات الإضافية للتحويل، مما يجعله أسرع منinnerHTMLالعمل أسرع بكثير.

النحو:

element.insertAdjacentHTML(position, text)

var head = document.getElementsByTagName("h2")[0];
head.insertAdjacentHTML("afterend", ":<span>Hello world</span>:);

تطابق المتصفحات

الرقم في الجدول يحدد إصدار المتصفح الأول الذي يدعم طريقة insertAdjacentHTML() بالكامل:

قيمة المتغير

مزيد من الأمثلة

استخدام القيمة "beginbegin":

var head = document.getElementsByTagName("h2")[0];
head.insertAdjacentHTML("afterbegin", ":<span style='color:red;'>مرحبا بالعالم</span>:);

استخدام قيمة "beforebegin":

var head = document.getElementsByTagName("h2")[0];
head.insertAdjacentHTML("beforebegin", "<span style='color:red;'>Hello world</span> ");

استخدام قيمة "beforeend":

var head = document.getElementsByTagName("h2")[0];
head.insertAdjacentHTML("beforeend", "<span style='color:red;'>Hello world</span> ");

مراجع ذات صلة

مرجع DOM HTMLالعنصرطريقة .insertAdjacentElement()

مرجع DOM HTMLالعنصرطريقة .insertAdjacentText()

مرجع DOM HTMLالنودطريقة .insertBefore()

مرجع DOM HTMLالنودطريقة .appendChild()

مثلث عنصر DOM HTML