Встраивание части веб-сайта

предположим, я хочу встроить последнюю комикс одной из моих любимых веб-комиксов в свой сайт в качестве своего рода продвижения для него. Веб-комикс имеет полоску внутри div с идентификатором, поэтому я решил, что могу просто вставить div на свой сайт, за исключением того, что я не мог найти примеров кода для того, как это сделать (все они показывают, как вставлять flash или весь сайт). Может кто-нибудь показать мне (или рассказать), как это делается?

PS Я бы предпочел не использовать серверные скрипты или внешние сервисы (что часто рекомендуется для внедрения RSS).

4 ответов


Update-кросс-доменный запрос с jQuery (на стороне клиента)

я просматривал блог Джеймс Padolsey, где он написал большую статью, о том, как сделать междоменный запрос С jQuery, также Крис Heilmann имеет хороший демо.

принцип заключается в использовании YQL -> api yahoo для запросов веб-страниц, где вы получаете JSON со всеми html. Счастливый выскабливание:)

очистка удаленных данных с помощью php, загрузить с помощью jQuery

как насчет рассмотрения простой AJAX звонок, что бы перехватить комический элемент и обновить его содержимое вашей <div id="update-comic" /> в основном используется для этой цели?

также вы будете использовать простой php получить удаленную страницу, потому что вы не можете сделать AJAX-вызов на другой домен

Примечание: пользователь должен иметь JavaScript включен, также следующий код использует библиотеку jQuery

собираем все вместе!--9-->
  1. на Вашей странице, где вы хотите отобразить удаленный комикс создать div только для этой цели, назовем это update-comic

    <div id="update-comic">
        <!-- here comes scraped content -->
    </div>
    
  2. записать php, назовем его comic-scrape.php, это скачать html от удаленной страницы, вы должны рассмотреть кэширование ответ и обновление его на заданном интервале (например, 30min, 1hr, ваш звонок.. :))

    производительность сервера не должна пострадать после простой реализации проверки кэша

    <?php
        $url = 'http://www.example.com/';
        $response = file_get_contents($url);
        echo $response;
    
  3. сейчас идет jQuery magic, где вы делаете вызов ajax на своем PHP-скребке и берете только соответствующий элемент, который вас интересует. Поместите этот скрипт в свой посмотреть страницы (где у вас есть свой <div id="update-comic" />

    <script type="text/javascript">
    $(function () {
        // set all your required variables
        var 
            localUrl = '/comic-scrape.php',
            elementId = '#remote-comic-id',
            elementToUpdate = $('#update-comic');
    
            // update the local elementToUpdate with elementId contents
            // from your php in localUrl
    
            elementToUpdate.load(localUrl + ' ' + elementId;
    });
    </script>
    

надеюсь, я все предусмотрел.

использование simplexml и xpath

как предложил филфрео в комментарии, жизнеспособное решение также может содержать выбор необходимой серверной части id. Это очень легко с использованием PHP simplexml и немного xpath:

<?php

    // set remote url and div id to be found
    $elementId = 'remote-comic-id';
    $url = 'http://www.example.com/';

    // instantiate simple xml element and populate from $url
    $xml = new SimpleXMLElement($url, null, true);

    // find required div by id
    $result = $xml->xpath("//div[id={$elementId}]");

    // take first element from array, which is our desired div
    $div = array_pop($result);

    echo $div;

Это невозможно, потому что вы не можете манипулировать содержимым iframe/frame. Использование тега iframe просто изменит содержимое тега, но не src. Ни с AJAX, потому что вы должны быть в одном домене.

Так, например, вы можете использовать PHP с cURL или просто с fopen.


Вы можете просто использовать iframe. Содержание не буквально на этой странице, но похоже.

вот пример:http://www.w3schools.com/TAGS/tryit.asp?filename=tryhtml_iframe

это выглядит так:

<iframe src ="http://www.example.com/index.html" width="100%" height="300"></iframe>