注意事项:

1. 时间格式 = “2018-03-02 17:13:00”时,动态获取的时间无法通过 拼接字符串的方法 添加到 dom元素的 datetime属性上,结果为 <div class="time" datetime="2018-03-02"17:13:00></div>,因为中间有空格。如果使用hogan.js模板引擎{{time}}则不存在此问题。

  解决办法为:用js动态添加  时间变量  到dom节点的 datetime属性上。

       即:<div class="time" datetime=“”></div>;

       $(‘.time’).attr('datetime',时间变量);

timeago.js 是一个非常简洁、轻量级、不到 2kb 的很简洁的 Javascript 库,用来将 datetime 时间转化成类似于*** 时间前的描述字符串,例如:“3小时前”。

    • 本地化支持,默认自带中文和英文语言;

    • 之前 xxx 时间前、xxx 时间后;

    • 支持自动实时更新;

    • 支持npm方式和浏览器script方式;

    • 测试用例完善,执行良好;

html:

<div class="time" datetime="2018-03-02 17:13:00"></div>

js:

<script src="https://cdn.bootcss.com/timeago.js/3.0.2/timeago.js"></script>
<script>
  // 不自动更新
  var timeagoInstance = timeago();// 实例
  var time = timeagoInstance.format('2018-03-2 17:13:00','zh_CN');
  console.log(time);

  // 自动更新
  var timeagoInstance = timeago();// 实例
  timeagoInstance.render(document.querySelectorAll('.time'),'zh_CN');

</script>

timeago.js-时间显示插件的更多相关文章

  1. [转载]时间显示插件 flipclock.js

    <html> <head> <link rel="stylesheet" href="/assets/css/flipclock.css&q ...

  2. JS时间扩展插件

    前言 原生JS有些没定义的方法只能自己封装了,比如获取现在相隔本年过了几天以及过了多少周,这些都是原JS里没有的方法,现在插件只有一些方法,后期再慢慢扩展 插件使用方法 引用TimeToPack.js ...

  3. 一款好用的JS时间日期插件layDate

    觉得这个插件很不错,使用起来也很方便,推荐使用 1.插件截图 2.插件配置 选择很多,配置也很简单,插件官网:https://www.layui.com/laydate/配置说得很明确,基本操作就是: ...

  4. jQuery时间轴插件timeline.js

    http://www.jq22.com/jquery-info13695 http://www.jq22.com/jquery-info13357 简要教程 timeline.js是一款jQuery时 ...

  5. js时间倒计时

    看了网上的其他的例子,觉得写的都有点复杂,不好理解,于是自己动手写了个. 本来想封装成jquery插件,但是觉得因为功能很简单,没有必要做成jquery插件,引用的时候不需要引入jqery库,这里直接 ...

  6. 前端 时间个性化 插件 jquery.timeago.js

    关键词 : 时间格式化 刚刚 N分钟前 N小时前 N天前 N月前 N年前 MM-dd hh:mm  或者  yyyy-MM-dd 前端: <span class="time" ...

  7. ****timeago.js插件:jquery实现几分钟前、几小时前、几天前等时间差显示效果的代码实例

    前端 时间个性化 插件 jquery.timeago.js 关键词 : 时间格式化 刚刚 N分钟前 N小时前 N天前 N月前 N年前 MM-dd hh:mm  或者  yyyy-MM-dd 前端: & ...

  8. js获取当前时间显示在页面上

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  9. jQuery时间格式插件-moment.js的使用

    jQuery时间格式插件-moment.js的使用 moment.js插件的使用,使用之前在页面引入对应的js文件: 详细的操作可见moment中文官网:http://momentjs.cn/ 日期格 ...

随机推荐

  1. go语言入门(三)

    条件语句 go语言的条件语句结构如下: go语言的条件语句和其他语言类似.简单列举下: 1.if 语句,布尔表达式不需要括号 if 布尔表达式 { /* 在布尔表达式为 true 时执行 */ } 2 ...

  2. [ python ] 字符串的操作及作业题

    字符串的操作方法 capitalize() : 首字母大写 s1 = 'my heart will go on' print(s1.capitalize()) # 首字母大写 # 执行结果: # My ...

  3. HDU 2647 Reward(拓扑排序+判断环+分层)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2647 题目大意:要给n个人发工资,告诉你m个关系,给出m行每行a b,表示b的工资小于a的工资,最低工 ...

  4. python抓取链家房源信息(三)

    之前写过一个链家网北京二手房的数据抓取,然后本来今天想着要把所有的东西弄完,但是临时有事出去了一趟,耽搁了一下,然后现在是想着把北京的二手房的信息都进行抓取,并且存储在mongodb中, 首先是通过' ...

  5. (转)Opencv卷积操作

    转自:http://www.2cto.com/kf/201312/267308.html Mask Operation filter2D函数 Last Edit 2013/12/24 所谓的Mask ...

  6. email的传输协议与格式(资源链接)

    以下链接为转载. 传输协议: 发:SMTP 收:POP3, IMAP 格式: MIME

  7. vue中methods、watch、computed之间的差别对比以及适用场景

    首先要说,methods,watch和computed都是以函数为基础的,但各自却都不同: 一.computer 当页面中有某些数据依赖其他数据进行变动的时候,可以使用计算属性. <p id=& ...

  8. 编译PHP并与Ngnix整合

    nginx本身不能处理PHP,它只是个web服务器,当接收到请求后,如果是php请求,则发给php解释器处理,并把结果返回给客户端. nginx一般是把请求发fastcgi管理进程处理,fascgi管 ...

  9. 用vue-wechat-title为微信动态设置标题

    1.安装插件 cnpm install vue-wechat-title --save 2.在main.js中引入 Vue.use(require('vue-wechat-title')) 3.在路由 ...

  10. 洛谷P4644 [USACO2005 Dec]Cleaning Shifts 清理牛棚 [DP,数据结构优化]

    题目传送门 清理牛棚 题目描述 Farmer John's cows, pampered since birth, have reached new heights of fastidiousness ...