前端技巧精粹-优快云博客

1.删除字符串中最后一个字符

(1) str = str.substr(0, str.length - 1);
(2) str = str.substring(0, str.length - 1);
(3) str= str.substring(0, str.lastIndexOf(’,’));

2.获取url地址栏传过来的值

方案一：

urls = 'http://www.shop.com?id=1';
var urls = window.location.href;
var a = urls.indexOf('=');
var b = urls.substr(a+1);
var b= b.replace(/[^0-9]/ig,"");

方案二：

url = 'http://www.shop.com?id=1&name=123fajf';
function getIdval(url){
    var str1 = url.indexOf('?');
    var str2 = url.substr(str1+1);
    var str3 = str2.split('=');
    if(str3[1].indexOf('&') != -1){
        var str4 = str3[1].split('&');
        return str4[0]
    }else{
        return str3[1];
    }
}

方案三

//获取url地址参数
function urlData(url){
	var a = url.substr(url.lastIndexOf('?')+1);
	var newarr = {};
	if(a.search('&') == -1){
        var b = a.split('=');
        newarr[b[0]] = b[1];
        return newarr;
    }
	var arr = a.split("&");
	for(var i in arr){
	    var arr2 = arr[i].split('=');
	    newarr[arr2[0]] = arr2[1];
	}
	return newarr;
}

3.获取当前input框所有被选中的数量

$("input[name=demo1:checked]").length

4.jquery在某个元素前/后插入元素

$("demo").before('abc'); // 在某个元素前面插入
$("p").after("<p>Hello world!</p>"); // 咋某个元素后面插入
$("p").append(' '); // 在某个元素后面追加

5.jquery点击回到顶部

$('#back-top').click(function(){
                // html，body取并级，处理浏览器兼容
                $("html,body").animate({
                scrollTop: 0,
                screenLeft: 0,
                }, 400); 
            });

6.jquery实现页面滑动超过某个元素距离页面顶部的距离时增加固定定位

$(window).scroll(function(){ // 监听页面滚动
            var tops=$(".zdy-cls").offset().top; //获取该元素距离顶部的高度
            var ntop=$(window).scrollTop(); // 获取当前页面滚动的高度
            if(Math.ceil(tops) < ntop){ // 判断如果当前滚动的高度大于该元素距离顶部的高度则执行以下代码
                $(".zdy-cls-box").css({'position':'fixed','top':'0','left':'0','background':'#fff','z-index':'2'});
            }else{
                $(".zdy-cls-box").css({'position':'static','background':'none'});
            }
        });

7.a标签锚点不影响url地址

<a onclick="javascript:document.getElementById('recipe').scrollIntoView()">食谱</a>

8.js 判断字符串中是否包含某个字符

方法一: indexOf()   (推荐)

var str = "123";
console.log(str.indexOf("3") != -1 );  // true
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。如果要检索的字符串值没有出现，则该方法返回 -1。

 

方法二: search() 

var str = "123";
console.log(str.search("3") != -1 );  // true
search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。如果没有找到任何匹配的子串，则返回 -1。

 

方法三:match()

var str = "123";
var reg = RegExp(/3/);
if(str.match(reg)){
    // 包含        
}
match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。

RegExp 对象方法

方法四:test() 

var str = "123";
var reg = RegExp(/3/);
console.log(reg.test(str)); // true
test() 方法用于检索字符串中指定的值。返回 true 或 false。

 

方法五:exec()

var str = "123";
var reg = RegExp(/3/);
if(reg.exec(str)){
    // 包含        
}
exec() 方法用于检索字符串中的正则表达式的匹配。返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。