javascript - 仅加载部分段落文本的 div

标签 javascript jquery html css

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

我正在加载 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>

最佳答案

这个选择器似乎可以工作:

$( "#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 中测试过了.

它返回:

e

Welcome to the brand new ****!

关于javascript - 仅加载部分段落文本的 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30126474/

相关文章:

javascript - 如何使用 JQuery 选中复选框

html - 2 个表单的 2 个提交按钮 - 水平对齐的提交按钮

javascript - Nodejs中的变量范围问题

javascript - 如何在显示/隐藏中使用过渡

javascript - 为什么我无法获取数组长度

Jquery:忘记 DOM 结构,只需找到此类的下一个元素

javascript - 重定向到特定页面并在js中编写该页面的代码onload

javascript - html5游戏中的音效

javascript - 提交表单时将输入文本转换为小写

html - 符号宽度和高度