Question

我正在尝试使用JQuery timeago插件在我的网站中实现'time-ago'功能。不幸的是我遇到了一些问题。

<script type="text/javascript" charset="utf-8">
jQuery("abbr.timeago").timeago();
</script>

var content = document.getElementById('div');

var html = "<abbr class=timeago title=2008-07-17T09:24:17Z></abbr>" + '<br>';
content.innerHTML += html

<div id='div'></div>

这个jquery插件基本上可以从标题中转换时间戳，并为每个abbr class = timeago以漂亮的格式打印它。问题是上面的代码不起作用，但如果我把它放在这个div中它工作正常。我想这可能是因为这个jquery插件是在javascript生成html之前应用的，但我不确定。有什么想法吗？

Answer 1

我敢打赌，问题在于，在将<abbr>元素放入页面之前，初始化“timeago”插件的语句正在运行。因此，当它运行时，没有任何反应。

为什么在你有jQuery的时候用原始代码添加到DOM？

$('#div').append($('<abbr/>') .addClass('timeago') .attr('title', '2008-07-17T09:24:17Z') ).append($('<br/>')).append($('<br/>')) .find('abbr.timeago').timeago();

（我假设你确实有一个<div>元素，其中“id”值为“div”。）

声明：

$('abbr.timeago').timeago();

表示“使用”timeago“类找到所有<abbr>元素，并在每个元素上初始化”timeago“插件。”它确实不意味着，“只要页面上有<abbr>元素，并且它具有”timeago“类，那么请确保设置了”timeago“插件它。”

Answer 2

var html = "<abbr class=timeago title=2008-07-17T09:24:17Z></abbr>" + '<br><br>';

首先，将您的属性放在引号中：

var html = "<abbr class=\"timeago\" title=\"2008-07-17T09:24:17Z\"></abbr>" + '<br><br>';

另请参阅此页面：http://www.w3schools.com/TAGS/tag_abbr.asp

ABBR标记的要点是提供有关爬虫等内联元素的其他信息。我很难想到你可能想在日期时间使用它的原因。

我会说，而不是爬过一个你不太了解的插件，试图找出它为什么喜欢div而不是abbr，只需使用div。如果必须是内联元素，请使用<span>。

Answer 3

我自己想通了。使用jQuery.timeago（timestamp）函数比处理abbr等更好。

Javascript中的HTML问题

3 个答案: