Metoda insertAdjacentHTML()
se aplica la obiecte HTML preluate in JavaScript si poate fi utilizata pentru adaugarea de continut HTML in pagina la o pozitie specificata, in raport cu elementul la care e aplicata.
Aceasta nu afecteaza celelate elemente din pagina.
'beforebegin'
- inaintea elementului.'afterend'
- dupa element.'afterbegin'
- la inceput in interior.'beforeend'
- in interior, la sfarsit.<div id="dv1"> #dv1, https://marplo.net/</div><br> La clic pe buton adauga cu insertAdjacentHTML() continut HTML inainte de Div-ul #dv1.<br> <button id='btn1'>Click</button> <script> var dv1 = document.getElementById('dv1'); document.getElementById('btn1').addEventListener('click', (ev)=>{ var cnt = '<em> Website: </em>'; dv1.insertAdjacentHTML('beforebegin', cnt); }); </script>
<div id="dv1"> #dv1, https://gamv.eu/</div><br> La clic pe buton adauga cu insertAdjacentHTML() continut HTML dupa Div-ul #dv1.<br> <button id='btn1'>Click</button> <script> var dv1 = document.getElementById('dv1'); document.getElementById('btn1').addEventListener('click', (ev)=>{ var cnt = '<em> Website: </em>'; dv1.insertAdjacentHTML('afterend', cnt); }); </script>
<div id="dv1"> #dv1, https://marplo.net/</div><br> La clic pe buton adauga un continut HTML in interiorul Div-ului #dv1, la inceput.<br> <button id='btn1'>Click</button> <script> var dv1 = document.getElementById('dv1'); document.getElementById('btn1').addEventListener('click', (ev)=>{ var cnt = '<em> Website: </em>'; dv1.insertAdjacentHTML('afterbegin', cnt); }); </script>
<div id="dv1"> #dv1, https://gamv.eu/</div><br> La clic pe buton adauga un continut HTML in interiorul Div-ului #dv1, la sfarsit.<br> <button id='btn1'>Click</button> <script> var dv1 = document.getElementById('dv1'); document.getElementById('btn1').addEventListener('click', (ev)=>{ var cnt = '<em> Games </em>'; dv1.insertAdjacentHTML('beforeend', cnt); }); </script>
O metoda similara este: element.insertAdjacentText(position, string)
.
Aceasta adauga sirul de la 'string' in pozitia de la 'position', relativ la 'element'.
- 'position' are aceleasi valori ca si insertAdjacentHTML(); diferenta e faptul ca insertAdjacentText()
adauga sirul asa cum e, tag-urile HTML nu sunt adaugate in DOM, ci afisate ca text.
<div id="dv1"> #dv1, https://gamv.eu/</div><br> La clic pe buton adauga un sir text in interiorul Div-ului #dv1, la sfarsit.<br> <button id='btn1'>Click</button> <script> var dv1 = document.getElementById('dv1'); document.getElementById('btn1').addEventListener('click', (ev)=>{ var cnt = '<em class="cls"> Games </em>'; dv1.insertAdjacentText('beforeend', cnt); }); </script>
<ul> <li>http://coursesweb.net/html/</li> <li>http://www.marplo.net/html/</li> </ul>
.some_class { display: list-item; }
var obj = { "courses": ["php", "javascript", "ajax"] }; var jsonstr = JSON.stringify(obj); alert(jsonstr); // {"courses":["php","javascript","ajax"]}
$strhtml = '<body><div id="dv1">CoursesWeb.net</div></body>'; $dochtml = new DOMDocument(); $dochtml->loadHTML($strhtml); $elm = $dochtml->getElementById("dv1"); echo $elm->nodeValue; // CoursesWeb.net
I`m living here. - Traiesc /Locuiesc aici.
Estoy viviendo aquĆ. - Traiesc /Locuiesc aici.