0

我有一个 news.html 页面,其中的文章在<article id="postNUM" class="post">其中 NUM 是每个不同的数字,<h4>标题为新闻文章,图像<img src="imageURL" class="postPic" />

在我的主索引页面上,有一个画廊应该显示前 4 篇新闻文章(只有图片和标题,它们链接到 news.html#postNUM)。

我对此很陌生,但我设法获得了前 4 个完整的帖子,或者只是前 4 个<h4>标签或前 4 个<img>

我需要的是创建一个新的<div id="slideNUM"><a href="news.html#postNUM" ><img src="imageURL" /><div class="caption>title of article</div></a></div>.

我怎样才能得到每个<h4>没有<h4></h4>标签的文本,只有<img>每篇文章的 src 值和 id 属性的值。例如 postNUM。

这是我在索引页上的 jQuery 代码:

<script type="text/javascript">
$(document).ready(function() {
var currentPost = 0;
var totalPosts = 4;
var slideNum = 1;

$.get('news.html', function(data){
    while(currentPost < totalPosts){
        var $newsPost = $(data).find("article.post");
        var articleID = $newsPost.get(currentPost).attr('id');
        var $newsTitle = $newsPost.get(currentPost).find("h4");
        var postPic = $newsPost.get(currentPost).find("img.postPic").attr('src');
        $('#printPosts').append('div id="slide'
            + slideNum
            + '"><a href="news.html#'
            + articleID
            + '"><img src="'
            + postPic
            + '" /><div class="caption">'
            + $newsTitle
            + '</div></a></div>');
        currentPost = currentPost + 1;
        slideNum = slideNum + 1;
    }
});
});
</script>
<div id="printPosts"></div>

我真的不知道如何只获取锚的 href 值、图像 src 值和 h4 文本。

4

2 回答 2

0

我怎样才能得到每个没有标签的文本

jQuery.each()

通用迭代器函数,可用于无缝迭代对象和数组。具有长度属性的数组和类数组对象(例如函数的 arguments 对象)通过数字索引进行迭代,从 0 到 length-1。其他对象通过其命名属性进行迭代。 jQuery上。

鉴于此标记:

<h4>1</h4>
<h4>2</h4>
<h4>3</h4>
<h4>4</h4>

这个 jQuery 代码:

$.each($('h4'), function(i, v) { console.log($(v).html()); });

产生这些消息:

1 
2
3
4
于 2013-06-04T05:33:59.450 回答
0

您应该阅读您已经使用的 jquery 方法的作用。

如果要获取 html 属性,请.attr在 jquery 对象上使用该方法。因此,对于您要获取的属性,您可以使用:

.attr('href')

这将返回与href前面的选择器匹配的 url 的值。

对于图像 src 它只是:

.attr('src')

然后对于 html 元素的文本节点,可以使用:

.text()
于 2013-06-04T05:06:50.850 回答