Question

我正在尝试从TripAdvisor Widget呈现的代码中获取一些HTML元素。

<div id="TA_selfserveprop423" class="TA_selfserveprop" style="display: none;">
    <ul id="6rK9LP" class="TA_links 6OfnXtypSP7O">
        <li id="vWwqKw7sl" class="PhWrYsr"><a href="http://www.tripadvisor.com/" target="_blank"><img src="http://www.tripadvisor.com/img/cdsi/img2/branding/150_logo-11900-2.png" alt="TripAdvisor" /></a></li>
    </ul>
</div>
<script src="http://www.jscache.com/wejs?wtype=selfserveprop&amp;uniq=423&amp;locationId=3386635&amp;lang=en_US&amp;rating=true&amp;nreviews=5&amp;writereviewlink=true&amp;popIdx=true&amp;iswide=false&amp;border=true&amp;display_version=2">
</script>

呈现的代码具有此元素，这是我想用jQuery获取的元素：

<ul class="widSSPBullet">
    <li> <span class="widSSPDate">Jan 8, 2016:</span> <span class="widSSPQuote">“Great week in cabo”</span> </li>
    <li> <span class="widSSPDate">Dec 20, 2015:</span> <span class="widSSPQuote">“Plesent stay”</span> </li>
    <li> <span class="widSSPDate">Nov 1, 2015:</span> <span class="widSSPQuote">“Great stay”</span> </li>
    <li> <span class="widSSPDate">Oct 26, 2015:</span> <span class="widSSPQuote">“Marina Sol is Awesome!”</span> </li>
    <li> <span class="widSSPDate">Sep 19, 2015:</span> <span class="widSSPQuote">“Warm and welcoming and best location in...”</span> </li>
</ul>

但是，看起来直到文档准备好后才会呈现，甚至可能在加载窗口之后呈现。也许我做错了什么，但有没有办法等到元素加载然后用jQuery抓取它。理想情况下，我想通过Trip Advisor的小部件或API获得完整的评论，但我不认为他们提供了这些。我查看了解析审阅页面，但是使用AJAX存在交叉问题，JSONP似乎也是如此。

Answer 1

如果他们真的既没有在他们的小部件中公开公共API也没有暴露事件系统，那么最简单的方法就是轮询：

var tripAdvisorCheck = setInterval(function () {
    $(".widSSPBullet").each(function () {
        clearInterval(tripAdvisorCheck);
        // do something with $(this)
    });
}, 250);

每250毫秒运行一次，直到在您的页面中找到至少一个.widSSPBullet，此时它会自动禁用，并允许您执行您想要对该元素执行的任何操作。

更高科技的方法是使用MutationObserver来观察某个元素的创建，下行是non-universal browser support（至少目前）并且需要编写更多代码同样。

Answer 2

<script type="text/javascript">
    var tripAdvisorCheck = setInterval(function () {
        jQuery(".widSSPBullet").each(function () {
    reviews = jQuery(".widSSPBullet li");
    index = 0;
            showReviews(index, reviews);
            clearInterval(tripAdvisorCheck);
        });
    }, 250);

        function showReviews(index, reviews) {
                setInterval(function() {
                         jQuery("#tripAdvisorReviews").html(reviews[index]);
                         index++;
                         if (index == reviews.length) index = 0;
                     },
                  5000);
        }
</script>
<div id="tripAdvisorReviews" style="font-size:32px;color:white;">
</div>

但页面上发生了一些奇怪的事情。似乎每次都是：jQuery（＆＃34;＃tripAdvisorReviews＆＃34;）。html（评论[index]）;从ul class =＆＃34; widSSPBullet＆＃34;执行相应的li元素。被删除？

我真正喜欢的是能够从此页面检索完整评论：Link To TripAdvisor Page以便我可以在我的页面上制作一种轮播。您显然无法使用AJAX或JSONP检索它？

Answer 3

实际上提供了一个API：

TripAdvisor API

如果所有者可以获得API密钥，这可能是更好的方法。

在文档就绪jQuery之后获取由外部javascript src呈现的元素

3 个答案: