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/ 日期格 ...
随机推荐
- localhost或127.0.0.1或192.168.1.*被转到129129.com上的问题
系统启动里会有个httpd的apache程序在运行,自启禁用掉后.windows下有个apache文件夹,干掉就可以. 个别GHOST XP程序里面会装这种流氓程序.
- [转载]ACE的陷阱
转自: http://blog.csdn.net/fullsail/article/details/2915685 坦白说,使用这个标题无非是希望能够吸引你的眼球,这篇文章的目的仅仅是为了揭示一些AC ...
- ssh修改端口号并进行远程访问
ssh的访问如果都利用22端口,则会容易被攻击,修改一个端口号可增强一定的安全性 1. 修改配置文件sshd_config里端口号 [root@test ~]# vi /etc/ssh/sshd_co ...
- 使用jolokia api监控ActiveMQ
jolokia api提供了一种通过HTTP访问JMX获得AMQ后台数据的一种方式,即Restful Api #!/usr/bin/env python # -*- coding:utf-8 -*- ...
- ELK简单使用
原作者:http://www.cnblogs.com/snidget/p/6269383.html ELK ELK是什么? Elasticsearch LogStash Kibana 1,简单 ...
- laravel入门教程
参考地址:https://github.com/johnlui/Learn-Laravel-5/issues/16
- 数据库介绍及MySQL安装
阅读目录 一.数据库是什么? 二.数据库特点 三. 什么是数据库管理系统(DataBase Management System 简称DBMS) 四.数据库服务器.数据管理系统.数据库.表与记录的关系( ...
- [笔记] 几个前端bug的解决方案
jQuery UI下被拖动的元素上飘 症状出现在几乎所有浏览器里.使用 1.10.x 的draggable,在滚动栏下移(即非处于页面顶部)的时候拖动draggable的元素,它会向上跳一段距离.解决 ...
- python生成器 协程
生成器 参考文章: 协程 gevent 生成器进阶 看个例子: def gg(): n='' i=0 while True: n=yield i #通过send传入到n if not n: pa ...
- css让元素不可点击 pointer-events: none;
张鑫旭大神:http://www.zhangxinxu.com/wordpress/2011/12/css3-pointer-events-none-javascript/ 我们知道form元素里的 ...