在 jQuery 中每次出现时更改属性值，

Question

我尝试将每个<a> 元素的属性“数据发布”的值更改为由更改日期格式的 romString 函数更改的值。我做错了什么？

<script>


      $(function(){       

        var id='139540263@N06';
        var tag = document.getElementById('html').getAttribute("data-tag");


        // Flickr Photostream feed link.
        $.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?id=" + id + "&tags="+ tag + "&lang=en-us&format=json&jsoncallback=?", 

            function(data){$.each(data.items, 

                function(i,item){


                    // Number of images to show.            
                    if(i < 4){

                    var newTaken=new Date(item.date_taken.replace("T"," ").replace("Z","").replace("-08:00","")).getTime();
                    alert(newTaken);
                    // Create images and append to div id flickr and wrap link around the image.
                    $("<img/>").attr("src", item.media.m.replace('_z', '_c')).appendTo("[data-tag=html]").wrap("<a href='" + item.media.m.replace('_z', '_c') + "' name='"+ item.link + "' title='" +  item.title + "'data-taken='" + newTaken + "'data-published='" + item.published.replace("T"," ").replace("Z","") + "'></a>");



                    }

                }); 

            }); 

        });



    </script> 

现在它会提醒 newTaken 是 NaN。你知道为什么吗？

Answer 1

html 出现格式错误

<a data-published="2016-01-20 11:15:49" data-taken="2010-01-20 03:15:49" title="3" name="flickr.com/photos/139540263@N06/24130487059/"; href="farm2.staticflickr.com/1665/…; <img src="farm2.staticflickr.com/1665/…; </a>

不应在属性值分配结束时包含;；在属性值处缺少关闭 "。

---

将.getTime() 移至new Date() 关闭后；而不是parts的匹配结果的最后索引

function romString(dateAsString){
    var parts = dateAsString.match(/(\d{4})-(\d{2})-(\d{2}) (\d{2}):(\d{2}):(\d{2})/);
    return new Date(parts[1],
                parts[2] - 1,
                parts[3],
                parts[4],
                parts[5],
                parts[6]).getTime();
}
$('.gallery a').each(function() {
    var value = $(this).attr('data-published');
    var new_value=romString(value);
    $(this).attr('data-published', new_value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div class="gallery">
<a data-published="2016-01-20 11:15:49" data-taken="2010-01-20 03:15:49" title="3" name="flickr.com/photos/139540263@N06/24130487059/" href="farm2.staticflickr.com/1665/…"> <img src="farm2.staticflickr.com/1665/…" /> </a>
  </div>

function romString(dateAsString){
    var parts = dateAsString.match(/(\d{4})-(\d{2})-(\d{2}) (\d{2}):(\d{2}):(\d{2})/);
    return new Date(parts[1],
                parts[2] - 1,
                parts[3],
                parts[4],
                parts[5],
                parts[6]).getTime();
}
$('.gallery a').each(function() {
    var value = $(this).attr('data-published');
    var new_value=romString(value);
    $(this).attr('data-published', new_value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div class="gallery">
<a data-published="2016-01-20 11:15:49" data-taken="2010-01-20 03:15:49" title="3" name="flickr.com/photos/139540263@N06/24130487059/" href="farm2.staticflickr.com/1665/…"> <img src="farm2.staticflickr.com/1665/…" /> </a>
  </div>

Answer 2

为什么不这样做

$('.gallery>a').each(function() {
  var dt = $(this).data('published');
  $(this).data('published',new Date(dt).getTime());
});

假设格式为

$(function() {
  $(".dd").each(function() {
    var dt = $(this).data("published");
    $(this).data("published",new Date(dt).getTime());
    $(this).text($(this).data("published"));
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="dd" data-published="2015-01-21 16:43:00"></div>
<div class="dd" data-published="2016-01-21 16:43:00"></div>