Javascript 使用jQuery抓取页面标题URL时,在图像后添加一个阅读更多链接

Javascript 使用jQuery抓取页面标题URL时,在图像后添加一个阅读更多链接,javascript,jquery,html,Javascript,Jquery,Html,我有一把叉子 我想添加一个阅读更多的链接后,图像或某些字符限制后,可能在100左右。但是我在抓取页面标题的链接时遇到了问题。我想让脚本动态化 现在我的jQuery是这样写的 jQuery $('.BlockContent p').each(function() { var txt = $(this).text(); var link = $('#NewsContent .p-name').attr("href"); if (txt.length>5) {

我有一把叉子

我想添加一个阅读更多的链接后,图像或某些字符限制后,可能在100左右。但是我在抓取页面标题的链接时遇到了问题。我想让脚本动态化

现在我的jQuery是这样写的

jQuery

$('.BlockContent p').each(function() {
    var txt = $(this).text();
    var link = $('#NewsContent .p-name').attr("href");
    if (txt.length>5) {
        $(this).html('<span>'+txt.substring(0,5)+'&nbsp;&nbsp;</span><a href="link"> Read More</a>');
    }
}); 
$('.BlockContent p')。每个(函数(){
var txt=$(this.text();
var link=$('#newcontent.p-name').attr(“href”);
如果(txt.length>5){
$(this.html(''+txt.substring(0,5)+'');
}
}); 
我的HTML

<div class="BlockContent" id="NewsContent">
    <img src="http://placehold.it/600x300">
    <h1 class="p-name"><a href="#">Page Title</a></h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam in odio mi. Fusce varius urna quis sem viverra id laoreet sem imperdiet. Morbi ultricies varius tortor, in congue ipsum facilisis ut. Suspendisse potenti. Nam ut eros quis orci eleifend rutrum vestibulum adipiscing nisl. Morbi mauris dui, iaculis consequat auctor in, auctor vel velit. Mauris lacinia adipiscing sapien, vel mollis massa pulvinar et. Curabitur eu urna venenatis nisi rhoncus eleifend. Nam dapibus lectus ac libero aliquet id malesuada tortor accumsan. Mauris lacus orci, euismod ac vehicula nec, scelerisque non tortor. Praesent quis odio a elit congue luctus. Aliquam ultricies, massa quis gravida tincidunt, justo mi scelerisque lectus, fringilla hendrerit tortor metus quis tellus. Suspendisse sit amet felis eu erat mollis rhoncus at non ligula. Fusce odio est, consectetur sed scelerisque quis, rhoncus ac lectus. Donec accumsan viverra eros, et vulputate augue laoreet et.</p>
</div>

Lorem ipsum dolor sit amet,是一位杰出的献身者。奥迪奥米的阿利奎姆。福斯瓦里乌纳奎斯,维韦拉和拉奥里特。面部同侧多发性杂音。潜力悬钩子。不,我爱你,我爱你。Morbi mauris dui,iaculis consequat拍卖人,拍卖人vel velit。毛里斯·拉齐尼亚(Mauris lacinia)是一位智者,他是一位普尔文纳(pulvinar)和库拉比(Curabitur eu urna venenatis nis rhoncus eleifend)的创始人。南·达皮布斯·莱库斯·阿利奎特·马莱苏阿达·托尔托·阿库姆桑(malesuada tortor accumsan)。Mauris lacus orci,euismod ac vehicula nec,无侵权者权杖。这是一个精英群体。别有用心的阿利夸姆,怀孕的马萨,我的权杖,弗林蒂利亚·亨德雷特的玉米饼。悬钩子坐在非利古拉的埃米特猫科动物埃拉特·莫利斯·朗卡斯(mollis rhoncus)。这是一个很好的例子。多内克·维韦拉·厄洛斯和奥古斯·拉奥里特等


有人能指出我做错了什么吗?

有一些问题,但你非常接近

第一个问题是,
链接
变量的目标是段落标记,而不是段落中的锚定标记。你可以这样解决:

var link = $('#NewsContent .p-name a').attr("href");
$(this).html('<span>'+txt.substring(0,5)+'&nbsp;&nbsp;</span><a href="'+link+'"> Read More</a>');
其次,当您试图将链接传递到“阅读更多”链接时,您没有连接,因此您只是将文本“链接”传递到
href
中。你可以这样解决:

var link = $('#NewsContent .p-name a').attr("href");
$(this).html('<span>'+txt.substring(0,5)+'&nbsp;&nbsp;</span><a href="'+link+'"> Read More</a>');
$(this.html)(''+txt.substring(0,5)+'';

获取标题链接的代码是选择h1元素,而不是其中的锚点

更改:
var link=$('#newcontent.p-name').attr(“href”)

收件人:
var link=$('#newcontent.p-name a').attr(“href”)

然后需要在字符串中正确连接该变量:

$(this).html('<span>' + txt.substring(0, 5) + '&nbsp;&nbsp;</span><a href="'+link+'"> Read More</a>');
$(this.html)(''+txt.substring(0,5)+'');

在查找is child'a'标记时,您正在选择带有类
p-name的
h1

修好选择器,你就可以出发了

var link = $('#NewsContent .p-name a').attr("href");

谢谢你,这确实有帮助@apad1让我们假设我不希望“每个”段落都有一个阅读更多链接,而只是“#newcontent”中的第一个p标记。如何实现这一点?将选择器更改为
$('.BlockContent p:first')。每个
谢谢。我想我必须重写这篇文章,因为我想隐藏其余的内容,只在第一段添加阅读更多链接@我很乐意帮忙!如果你还有其他问题,请告诉我。