Блог

Главная - Вопросы по программированию - альтернативы фреймам для включения содержимого с разных серверов

альтернативы фреймам для включения содержимого с разных серверов

#html #iframe #frame #frames #dropbox

#HTML #iframe #фрейм #фреймы #dropbox

Вопрос:

Мне нужно создать серию веб-страниц. Каждый с заголовком, поступающим с веб-сайта, и содержимым, поступающим с html-страницы в моем dropbox / public. Простым способом было бы использовать фреймы, но они устарели.

Поскольку содержимое html имеет разный размер. Таким образом, iFrame не кажется подходящим инструментом.

Какие альтернативы у меня есть?

Многие люди, похоже, предлагали в комментариях ajax с помощью jsonp. К сожалению, я совершенно новичок в этих методах, поэтому мне понадобится пример для копирования и последующей работы.

Спасибо, Пьетро

Комментарии:

1. jquery ajax могут творить чудеса самым простым способом.

2. интересно, можете ли вы расширить свое предложение в полноценном ответе с помощью кода, который я могу протестировать, проголосовать и в случае принятия?

3. Находятся ли веб-сайты, с которых вы хотите получить доступ, в вашем домене? Если нет, то единственный известный мне HTML-способ сделать это — iframes. Ознакомьтесь с этой статьей: snook.ca/archives/javascript/cross_domain_aj . Если они находятся в вашем домене, проверьте jquery ajax $.load: api.jquery.com/load

4. Они находятся в моем общедоступном Dropbox, поэтому они находятся вне моего домена. Спасибо за ссылку.

5. AJAX, JSONP и функция обратного вызова отлично справились бы с этой задачей.

Ответ №1:

На главной странице должна быть библиотека Jquery. Скопируйте приведенный выше код в заголовок вашей страницы:

 <script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>

Создайте div с response идентификатором:

 <div id="response"></div>

В jQuery есть AJAX-функция под названием «load», эта функция добавляется к селектору, в котором вы хотите загрузить страницу, в данном случае мы хотим содержимое файла «exemple.html » для загрузки в тег с идентификатором «ответ».

 <script>

$(document).ready(function(){
    // load exemple page when the page loads
    $("#response").load("exemple.html");
});

</script>

Также вы можете загружать содержимое при нажатии на ссылку с главной страницы:

 <script>

$("#exemple").click(function(){
    // load exemple page on click
        $("#response").load("exemple.html");
    });

</script>

Для этого вы должны добавить в свой HTML-код ссылку с id="exemple" 

 <a href="#" id="exemple">Click to load the exemple page</a>

Надеюсь, это вам поможет!