Получить содержимое тега из текста
Добрый день!
Подскажите пожалуйста как получить из текста тег и его содержимое? К примеру я хочу получить всё что внутри тега pagination: var mytext='<div class="tratata"><h1>sdgljsdg</h1><p>fdgkdfglkjdflgkj</p></div><div class="pagination"><div class="num">1</div><div class="num">2</div><div class="num">3</div></div><div class="tratata2"><h1>sdgljsdg</h1><p>fdgkdfglkjdflgkj</p></div>'; |
Непосредственно из текста трудно - надо писать свой парсер.
Проще создать элемент, всавить в него этот html код, а потом взять нужную часть Так, например const mytext=`<div class="tratata"><h1>sdgljsdg</h1><p>fdgkdfglkjdflgkj</p></div><div class="pagination"><div class="num">1</div><div class="num">2</div><div class="num">3</div></div><div class="tratata2"><h1>sdgljsdg</h1><p>fdgkdfglkjdflgkj</p></div>`; const tmp = document.createElement('template'); tmp.innerHTML = mytext; const fr = tmp.content; const epag = fr.querySelector('.pagination'); const res = epag.innerHTML; console.log(res); |
Нашёл следующее решение с использованием DOMParser().
Посмотрел совместимость вроде подходит под все современные браузеры. Написал код, вроде пока работает, возможно кому-то пригодится как пример (в мобильных браузерах ещё не испытывал). //AJAX пагинация для Joomla function ajaxLoadBlogItems(){ var nextPageLink=''; //Проверяю что на странице есть ссылка на следующую страницу и если есть то беру оттуда значение, а саму пагинацию удаляю if(d.querySelector('section.blog .pagination-next a')){ nextPageLink=d.querySelector('section.blog .pagination-next a').getAttribute('href'); d.querySelector('section.blog .pagination').remove(); } d.querySelector('#ajax-load-pages').addEventListener('click',function(){ //По клику на кнопку загружаю целиком страницу которую получил по ссылке выше if(nextPageLink.length>0){ if (nextPageLink.indexOf('&tmpl=component') < 0) { nextPageLink += '&tmpl=component'; } var blogReq=new XMLHttpRequest(); blogReq.open('GET', nextPageLink,false); blogReq.onreadystatechange = function(){ if(blogReq.readyState === XMLHttpRequest.DONE && blogReq.status === 200) { //Выдёргиваю нужные куски из responcseText (а там страница целиком) и помещаю в конец блога. var parser = new DOMParser(); var ajaxDoc = parser.parseFromString(blogReq.responseText, "text/html"); ajaxDoc.querySelectorAll('.blog-item').forEach(function(bitem){ d.querySelector('section.blog .items-container').append(bitem); }); if(ajaxDoc.querySelector('section.blog .pagination-next a')){ nextPageLink=ajaxDoc.querySelector('section.blog .pagination-next a').getAttribute('href'); } else { d.querySelector('#ajax-load-pages').style.display='none'; } } } blogReq.send(); } }); } //Пока работает. Возможно что-то неправильно сделал, но я в JS откровенный слабак :) |
Часовой пояс GMT +3, время: 12:32. |