Как обращаться с «бесконечными» веб-страницами? - PullRequest
15 голосов
/ 27 мая 2011

Давным-давно жизнь была простой: все веб-страницы имели конечную длину, и если они не вписывались в текущий размер окна / представления, вы просто прокручивали страницу вниз, пока не достигли нижней части страницы.

Но недавно я заметил, что в мире веб-дизайна появилась новая тенденция: Бездонные веб-страницы.

Вероятно, наиболее знакомые примеры сайтов, использующих такие страницы, это Facebook и Twitter: Вы прокручиваете до «дна» только для того, чтобы вызвать некоторое обновление, которое добавляет контент на страницу, поэтому «старое дно» больше не является дном и вместо этого появляется новое «дно».

В Android WebView мне нужно иметь возможность захватывать весь контент, в настоящее время доступный на этой «странице», но я не уверен, как к этому подойти:

Имитировать прокрутку пользователя вниз с помощью View.scrollBy (int x, int y) , pageDown () или window.scrollTo () ?

Или есть метод API, который делает это автоматически для меня?

Или я подхожу к этому ссовершенно неправильно, и я не должен пытаться добраться до «настоящего дна» за один захват (если вообще возможно)?

EDIT : кажется, что пометка этого вопроса javascript сообщалапротивоположное сообщение.Я заинтересован в захвате (затем обработке) таких бездонных страниц в Android WebView, используя Java .

Ответы [ 4 ]

2 голосов
/ 27 мая 2011

Редактировать: не обращая внимания на этот ответ, я неправильно понял вопрос.Оставляя ответ на тот случай, если другие также неправильно поймут вопрос.


Вы можете использовать jqPageFlow jQuery плагин или основываться на его документации.

Бесконечный свиток - еще один отличный вариант.

0 голосов
/ 31 мая 2011

Независимо от того, какой язык вы используете, решение довольно простое.Вы просто улавливаете поведение пользователя (фиксируя текущее значение y и сравнивая его с максимальным значением на странице), затем вы должны добавить новую информацию в свой контент посредством асинхронного соединения.Это все.Я не очень хорошо знаю Java, поэтому я могу лишь дать подсказку, но идея одинакова во всех технологиях / языках.

0 голосов
/ 29 мая 2011

Учитывая следующую веб-страницу:

<!DOCTYPE HTML>
<html lang="en-US">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <!-- website code -->

    <!-- The endless articles you want to process -->
    <div class="article">

    </div>
    <div class="article">

    </div>
    <div class="article">

    </div>
    <!-- ... -->        
</body>
</html>

Вот код для использования:

(function($) {      // closure
    $(function() {  // when the document is ready
        var height      = $(this).height(), // get initial height
            lastEl      = null,                // track last element processed
            getData     =
                // this function will process the data as it comes in
                function() {
                    var $elements = $(".article");
                    // don't reprocess data
                    if(lastEl) { 
                        $elements = $elements
                            .slice($elements.index(lastEl)+1); 
                    }

                    lastEl = $elements
                        .each(function() {
                            // do what you want with the element
                        })
                        // save the last element processed
                        .get(-1) || lastEl; 

                    // finally, scroll to the bottom of the page
                    $(window).scrollTop($(document).height());
                };

        $(document).bind('DOMSubtreeModified', function() {
            var newHeight = $(this).height();
            if(newHeight != height) {
                height = newHeight;
                getData();
            }
        });
        getData();
    });
})(jQuery));

Просто измените селектор $ elements на то, что вы хотите найти. Тогда ты должен быть в порядке. Это многословно, но также и с точки зрения производительности.

0 голосов
/ 27 мая 2011
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...