timeago.js-时间显示插件
注意事项:
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-时间显示插件的更多相关文章
- [转载]时间显示插件   flipclock.js
		
<html> <head> <link rel="stylesheet" href="/assets/css/flipclock.css&q ...
 - JS时间扩展插件
		
前言 原生JS有些没定义的方法只能自己封装了,比如获取现在相隔本年过了几天以及过了多少周,这些都是原JS里没有的方法,现在插件只有一些方法,后期再慢慢扩展 插件使用方法 引用TimeToPack.js ...
 - 一款好用的JS时间日期插件layDate
		
觉得这个插件很不错,使用起来也很方便,推荐使用 1.插件截图 2.插件配置 选择很多,配置也很简单,插件官网:https://www.layui.com/laydate/配置说得很明确,基本操作就是: ...
 - jQuery时间轴插件timeline.js
		
http://www.jq22.com/jquery-info13695 http://www.jq22.com/jquery-info13357 简要教程 timeline.js是一款jQuery时 ...
 - js时间倒计时
		
看了网上的其他的例子,觉得写的都有点复杂,不好理解,于是自己动手写了个. 本来想封装成jquery插件,但是觉得因为功能很简单,没有必要做成jquery插件,引用的时候不需要引入jqery库,这里直接 ...
 - 前端 时间个性化 插件 jquery.timeago.js
		
关键词 : 时间格式化 刚刚 N分钟前 N小时前 N天前 N月前 N年前 MM-dd hh:mm 或者 yyyy-MM-dd 前端: <span class="time" ...
 - ****timeago.js插件:jquery实现几分钟前、几小时前、几天前等时间差显示效果的代码实例
		
前端 时间个性化 插件 jquery.timeago.js 关键词 : 时间格式化 刚刚 N分钟前 N小时前 N天前 N月前 N年前 MM-dd hh:mm 或者 yyyy-MM-dd 前端: & ...
 - js获取当前时间显示在页面上
		
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
 - jQuery时间格式插件-moment.js的使用
		
jQuery时间格式插件-moment.js的使用 moment.js插件的使用,使用之前在页面引入对应的js文件: 详细的操作可见moment中文官网:http://momentjs.cn/ 日期格 ...
 
随机推荐
- MySQL删除数据几种情况以及是否释放磁盘空间【转】
			
MySQL删除数据几种情况以及是否释放磁盘空间: 1.drop table table_name 立刻释放磁盘空间 ,不管是 Innodb和MyISAM ; 2.truncate table tabl ...
 - juery给所有ID属性相同的div绑定一个事件
			
案例: <div id="div1">内容</div> <div id="div1">内容</div> < ...
 - C 中级 - SO_REUSEPORT 和 SO_REUSEADDR
			
引言 - 问题由来 刚开始学习网络编程时候, 常听到一个词, 先开启 "端口复用 SO_REUSEADDR". 那时很一知半解, 就知道该那么写了. 心里一直有些奇怪, 语义不通呀 ...
 - socket 开发 - 那些年用过的基础 API
			
---------------------------------------------------------------------------------------------------- ...
 - javascript 之数据类型--01
			
写在前面 国庆整理资料时,发现刚开始入门前端时学习JS 的资料,打算以一个基础入门博客记录下来,有不写不对的多多指教: 先推荐些书籍给需要的童鞋 <JavaScript 高级程序设计.pdf&g ...
 - 服务器Java环境配置
			
/* 当要在服务器里搭建Java web项目时, 要先配置好Java需要的环境 */ //jdk [root@localhost ~]# cd /usr/local/src [root@localho ...
 - 转载:Logistic回归原理及公式推导
			
转载自:AriesSurfer 原文见 http://blog.csdn.NET/acdreamers/article/details/27365941 Logistic回归为概率型非线性回归模型,是 ...
 - Flyweight模式(亨元模式)
			
这应该算是最好理解的一个设计模式了吧·················· 面向对象语言的原则就是一切都是对象,但是如果真正使用起来,有时对象数可能显得很庞大,比如,字处理软件,如果以每个文字都作为一个 ...
 - 简易web-slide
			
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
 - xpath语法规则
			
参考w3cschool教程 XPath 是一门在 XML 文档中查找信息的语言.XPath 可用来在 XML 文档中对元素和属性进行遍历. XPath 是 W3C XSLT 标准的主要元素,并且 XQ ...