js常用小方法

1.时间格式化

a.需要熟悉Date对象的方法;

b.使用  getFullYear(),getMonth(),getDate()等方法获取年份,月份等时间数据,然后根据所需要的时间格式可以自行拼接

demo:

下面以 这种格式为例:2017-09-15 15:10:06,

function format(timestamp) {
    // 获取时间戳 Date.parse(new Date());
    //timestamp是整数,否则要parseInt转换,不会出现少个0的情况
    var time = new Date(timestamp);
    var year = time.getFullYear();
    var month = time.getMonth() + 1;
    var date = time.getDate();
    var hours = time.getHours();
    var minutes = time.getMinutes();
    var seconds = time.getSeconds();
    return year + ‘-‘ + add0(month) + ‘-‘ + add0(date) + ‘ ‘ + add0(hours) + ‘:‘ + add0(minutes) + ‘:‘ + add0(seconds);
}
//当月份,日期,时分秒小于10时前面加0
function add0(m) {
    return m < 10 ? ‘0‘ + m : m
}

2.移动端页面中出现弹出框(模态框,提示框)时禁止底层页面滚动

a.出现弹出框时:body添加overflow:hidden,同时阻止其默认是事件

b.关闭弹出框时:body的overflow值置为auto,并启用默认事件使body可以正常滚动;

// 出现弹出框时
$("body").css("overflow", "hidden");
$(‘body‘).bind("touchmove", function (e) {
      e.preventDefault && e.preventDefault();
 });
//关闭弹出框时
$("body").css("overflow-y", "auto");
$("body").unbind("touchmove");

3.无缝滚动(新闻,中奖信息等)

html

<div class="award-items-state">
   <ul id="award-items-con" class="award-items-con"></ul>
   <ul id="award-items-con-clone" class="award-items-con"></ul>
</div>

css

.award-items-state {
    width: 5.5rem;
    height: 1.8rem;
    overflow: hidden;
    margin: 0 auto;
    line-height: 1.2;
}

js

var state = $(‘.award-items-state‘);//获取滚动内容的外部容器,需要定高,超出隐藏
var con = $(‘#award-items-con‘);// 滚动内容的容器,滚动的数据
var con_clone = $(‘#award-items-con-clone‘); // 存放复制内容的容器

function listScroll() {
//state.scrollTop() :该元素中的内容向上卷进去的高度
//con.get(0).offsetHeight:该元素的整体高度
    if (state.scrollTop() >= con.get(0).offsetHeight) {
        state.scrollTop(0);
    } else {
        state.scrollTop(state.scrollTop() + 1);
    }
}

//使用setInterval 实现滚动效果
setInterval(listScroll, 40);

有关scrollTop ,offsetHeight可以参照下图:

4.页面设置不缓存

<meta http-equiv="pragma" content="no-cache"/>
<meta http-equiv="cache-control" content="no-cache"/>
<meta http-equiv="expires" content="0"/>
<meta http-equiv="keywords" content=""/>
<meta http-equiv="description" content=""/>

5.jquery监测radio变化事件

        $("input[name=‘tourism‘]").change(function () {
            var tourism_val = $("input[name=‘tourism‘]:checked").val();
            console.log(‘选中的值:‘ + tourism_val);
        })

6.jQuery去除字符串的前后空格

var str = ‘  会捕鼠的鱼  ‘;
var other = $.trim(str);

7.button,input等禁用和启用

        // button,input 禁用
        $("#submit-question").attr(‘disabled‘, true);
        // button,input 启用
        $("#submit-question").attr(‘disabled‘, false);

8.正则匹配中英文的逗号(,),分号(;)

var other = ‘a,b,c;d;‘
industry = other.replace(/(,)|(,)|(;)|(;)/g, "-");

9.判断设备类型及判断iphone手机型号(iphone6,iphone6 s等等)

  1).判断设备类型

  

var os = function () {
                var ua = navigator.userAgent.toLowerCase(),
                    isAndroid = /(?:android)/.test(ua),
                    isTablet = /(?:ipad|playbook)/.test(ua) || (isAndroid && !/(?:mobile)/.test(ua)),
                    isPhone = /(?:iphone)/.test(ua) && !isTablet,
                    isPc = !isPhone && !isAndroid && !isTablet;
                return {
                    isTablet: isTablet,
                    isPhone: isPhone,
                    isAndroid: isAndroid,
                    isPc: isPc
                };
            }();console.log(os);

  2).判断iphone手机型号

  a.根据userAgent判断是否是iphone

  b.根据屏幕的宽高判断iphone的具体型号

        var isPhone6p = (function () {
            var h = window.innerHeight,
                w = window.innerWidth,
                ua = navigator.userAgent.toLowerCase(),
                isP6p = false;
            if (ua.match(/mobile/i) !== null && ua.match(/iphone/i) !== null && ( h > w ? (Math.abs(w - 414) < 10 && h <= 736) : (Math.abs(w - 736) < 10) && h <= 414)) {
                isP6p = true;
            }
            return isP6p;
        })();

10.页面简单适配

  7.5为 设计图 除以100

            var html = document.querySelector("html");
            var    rem = html.offsetWidth / 7.5;
            html.style.fontSize = rem + "px";

如有错误还望指出^-^

未完待续,持续更新ing

时间: 12-07

js常用小方法的相关文章

Js 常用小代码

//判断一个汉子等于两个字符 function getByteLen(val) { var len = 0; for (var i = 0; i < val.length; i++) { var a = val.charAt(i); if (a.match(/[^\x00-\xff]/ig) != null) { len += 2; } else { len += 1; } } return len; } Js 常用小代码

【js常用DOM方法】

介绍几个js DOM的常用方法 获取元素节点 getElementById  getElementsByTagName  getElementsByClassName 先写一个简单的网页做测试: /* test.html*/<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>test</title> </head> <body&g

js便携小方法,你值得拥有

引言: 本章没有深奥的讲解js一些底层原理,比如this指针.作用域.原型啦,涉及的都是一些有利于平时开发时简化代码,提高执行效率,或者说可以当做一种经验方法来使用,篇幅都不长,小步快跑的让你阅读完整篇文章. 获取两个区间之内随机数 function getRandomNum(Min, Max){ // 获取两个区间之内随机数 var Range = Max - Min + 1; var Rand = Math.random(); return Min + Math.floor(Rand * R

js常用通用方法

验证身份证详细方法 function isCardNo(pId) { var arrVerifyCode = [1, 0, "x", 9, 8, 7, 6, 5, 4, 3, 2]; var Wi = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2]; var Checker = [1, 9, 8, 7, 6, 5, 4, 3, 2, 1, 1]; if (pId.length != 15 && pId.leng

积累常用小方法(致自己)

1.星级评分:js超简单实现方法 var stars="★★★★★☆☆☆☆☆" function selectStars(index) { return stars.slice(5-index,10-index)} document.write(selectStars(0)+"<br>"); document.write(selectStars(1)+"<br>"); document.write(selectStars(

一些JS常用的方法

/**  * JS公用类库文件  */   (function(){     Tools = {         W: window,         D: document,         Postfix: ".php",         GetId: function(id){return document.getElementById(id)},         hi:function(){alert('Hi')},           /**          * 验证类  

Node.js常用express方法

Node.js 手册查询-Express 方法 1.send方法 send 方法向浏览器发送一个响应信息,并可以智能处理不同类型的数据 send方法在输出响应时会自动进行一些设置,比如HEAD信息.HTTP缓存支持等等 类型可以是: String, Array, Object, Number. 当参数为一个String时,Content-Type默认设置为"text/html" 当参数为Array或Object时,Express会返回一个JSON 当参数为一个NumberExpress

原生js常用的方法

1, js数组去重的方法 //第一种 function unique(ary){ var obj={}; for(var i=0;i<ary.length;i++){ var cur = ary[i]; if(obj[cur] == cur){ ary[i] = ary[ary.length-1]; ary.length--; i--; } obj[cur] = cur; } return ary; } console.log(unique([2,3,2,4,3,5,6,1,1])); //第二

js常用的方法

事件(事件监听) : 标签对象.事件监听.function(){执行的代码,找对象,找属性,改属性};    事件源.触发一个事件.调用一个方法.方法找执行代码找对象,找属性,改属性(或者用属性,增删改查)           onmouseover 鼠标移到某个元素之上           onmouseout  鼠标移开某个元素           onkeydown   键盘按下去(就是一直按着)           onkeypress  键盘按下去再松开(就是点击 按下去再松开)