Главная » Статьи » Скрипты для uCoz » Полезное

Подгрузка DIV с другой страницы сайта jQuery
Подгрузка DIV с другой страницы сайта jQuery
Хотя… Без частных случаев некоторые не смогут понять весь потенциал данного функционала. Выше уже упоминались скрипты, которые этот самый функционал используют, вот вам еще несколько:

Подгрузка материалов
Вывод фото на персональной странице
Вывод информации об авторе материала
Репутация в профиле
Вывод новых подарков

Все эти скрипты используют тот код, которому посвящен данный материал, собственно они преимущественно из него и состоят.

Основа основ

Чтобы подгрузить DIV или содержимое какого-либо элемента с другой страницы, 
используйте jQuery-функцию get:
<div id="loadcontent">Загрузка...</div> 

<script type="text/javascript"> 
$.get('http://the-only.ru/index/8-4', function (data) { 
 $('#loadcontent').html( $('.country', data).html() ) 
}); 
</script>
loadcontent – куда подгружать контент;

http://the-only.ru/index/8-4 – откуда подгружать контент;

.country – класс или ID конкретного элемента с указанной ссылки.
Это же можно сделать с помощью jQuery-функции load:
<div id="loadcontent">Загрузка...</div> 

<script type="text/javascript"> 
 $('#loadcontent').load('http://the-only.ru/index/8-4 .country'); 
</script>
Здесь класс или ID, содержание которого мы хотим подгрузить, прописывается сразу после ссылки.

Подгрузка несколько одинаковых DIV

Подгрузка ряда контента с одинаковыми атрибутами осуществляется с помощью each:
<div id="loadcontent"></div> 

<script type="text/javascript"> 
$.get('http://the-only.ru/index/8-4', function (data) { 
 $('.table_left', data).each(function (i,index) { 
 $('#loadcontent').append( $(this).html() ); 
 }); 
}); 

</script>
loadcontent – куда подгружать контент;

http://the-only.ru/index/8-4 – откуда подгружать контент;

.table_left – класс элементов с указанной ссылки.

Помимо класса и ID можно использовать и другие конструкции, вот несколько примеров:

$('.country', data).parent() – родительский элемент для country;

$('.country', data).parent().parent() – родитель родителя country и т.д.;

$('div:contains("Новый")', data) – DIV содержащий в себе текст Новый.

$('div[style="color:#FF0000"]', data).parent().parent() – DIV с аттрибутом style.

Ограничения. Не злоупотребляйте данной функцией, uCoz например, имеет вшитые лимиты, перейдя за которые можно получить блокировку сайта на час, но только непосредственно у одного пользователя. Не делайте больше трех запросов одновременно и не делайте их слишком часто.

На Урааа и других тематических ресурсах много однотипных скриптов в плане кода, разнятся только идеи. Вы тоже можете придумать на основе кода ниже что-то новенькое, что-то свое.

Пишите в комментариях что и куда можно вывести, свои идеи, или для чего вам понадобился скрипт вывода контента с другой страницы.
  


Источник: yraaa.ru
Категория: Полезное | Добавил: The^One (02.09.2016)
Просмотров: 562 | Рейтинг: 5.0/1
Всего комментариев: 0
avatar
▲ Вверх