仅使用段落文本的一部分加载div

时间:2015-05-08 14:37:58

标签: javascript jquery html css

我正在尝试使用Jquery .load函数为我的主页创建标题新闻Feed。

我正在加载页面news.html,我可以定位第一个元素(最新的新闻报道)。

$( "#headline" ).load( "news.html .media-left:first, .media-body:first", function() {

    $( "#headline" ).append("<a class='pull-right' href='news.html'>...Read more</a>");

});

但我无法弄明白的是如何只获取div和该div中的前两个段落,以便我可以创建一个更多的阅读按钮,将它们带到主要的news.html,每个我尝试引用段落的一部分,它只包括段落,并没有包含附加了样式的div media.body。

<div class="media menu-center">
    <div class="media-left">
        <div class="donut-yellow">
        <h4>
            <span class="month">May</span>
            <span class="day">23rd</span>
        </h4>
    </div>
    </div>
    <div class="media-body media-right ">
       <p class="media-heading"><strong>e </strong></p>
       <p>Welcome to the brand new ****!</p><p>To ensure that we continue to(...)</p>
       <p>Take a look around the new layout and make sure to keep an eye on this(...)</p>

       <span class="pull-right"><p class="bg-success"><strong>Paul</strong></p></span>
    </div>
</div>

1 个答案:

答案 0 :(得分:2)

这个选择器似乎有效:

$( "#headline" ).load( "news.html .media-body>p:nth-child(-n+2)", function() {

    $( "#headline" ).append("<a class='pull-right' href='news.html'>...Read more</a>");

});

我已在此Fiddle中对其进行了测试。

它返回:

  

ë

     

欢迎来到全新的****!