这些年,我收集的JavaScript代码(一)
一、取URL中的参数
function getParameterByName(name) {
var match = RegExp('[?&]' + name + '=([^&]*)')
.exec(window.location.search);
return match && decodeURIComponent(match[1].replace(/\+/g, ' '));
}
二、正则分组
var testStr="<div><img src='/a.jpg' alt='' /><span>test</span><img src='/b.jpg' alt='' /><span>TTest</span><img src='/c.png' alt='' /></div>";
var reg=/<img\ssrc='(.*?)'\s+alt=''\s*\/>/g;
var match=reg.exec(testStr),results=[];
while(match != null){
results.push(match[1]);
match=reg.exec(testStr);
}
console.log(results);
/*
Array ["/a.jpg", "/b.jpg", "/c.png"]
*/
三、为什么parseInt(1/0,19)的结果为18
1/0的结果是Infinity,所以parseInt(1/0,19)等同于parseInt("Infinity",19),而在19进制中:
19进制 10进制
--------------------
0 0
1 1
2 2
3 3
4 4
5 5
6 6
7 7
8 8
9 9
a 10
b 11
c 12
d 13
e 14
f 15
g 16
h 17
i 18
i表示18,所以parseInt(1/0,19)的结果为18。
四、jQuery中获取设置checkbox选中状态
由于在jQuery1.6以后.attr("checked")的返回结果是 checked,所以一般用下面两种方法获取选中状态:
$("#checkboxID").is(":checked");
//jQuery 1.6 +
$("#checkboxID").prop("checked");
选中checkbox:
//jQuery 1.6+
$("#checkboxID").prop("checked", true);
$("#checkboxID").prop("checked", false);
//jQuery 1.5 and below
$('#checkboxID').attr('checked','checked')
$('#checkboxID').removeAttr('checked')
五、jQuery中判断一个元素是否存在
if ($(selector).length)
六、用JavaScript对URL进行编码
var myUrl = "http://example.com/index.html?param=1&anotherParam=2";
var myOtherUrl = "http://example.com/index.html?url=" + encodeURIComponent(myUrl);
七、jQuery中event.preventDefault() 与 return false 的区别
//Demo1 event.preventDefault()
$('a').click(function (e) {
// custom handling here
e.preventDefault();
});
//Demo2 return false
$('a').click(function () {
// custom handling here
return false;
};
jQuery中return false相当于同时调用e.preventDefault 和 e.stopPropagation。
要注意的是,在原生js中,return false仅仅相当于调用了e.preventDefault。
八、JavaScript检查一个字符串是否为空最简单的方法
if (strValue) {
//do something
}
九、用JavaScript添加和删除class
//Add Class
document.getElementById("MyElement").className += " MyClass";
//Remove Class
document.getElementById("MyElement").className = document.getElementById("MyElement").className.replace(/(?:^|\s)MyClass(?!\S)/,'');
十、在jQuery中取消一个ajax请求
var xhr = $.ajax({
type: "POST",
url: "test.php",
data: "name=test",
success: function(msg){
alert( msg );
}
});
//取消请求
xhr.abort()
要注意的是,在ajax请求未响应之前可以用xhr.abort()取消,但如果请求已经到达了服务器端,这样做的结果仅仅是让浏览器不再监听这个请求的响应,但服务器端仍然会进行处理。
十一、JavaScript删除数组中的项 delete vs splice
var myArray=["a","b","c"];
delete myArray[0];
for(var i=0,j=myArray.length;i<j;i++){
console.log(myArray[i]);
/*
undefined
b
c
*/
}
var myArray2=["a","b","c"];
myArray2.splice(0,1);
for(var i=0,j=myArray2.length;i<j;i++){
console.log(myArray2[i]);
/*
b
c
*/
}
上面的代码已经说明区别了,一个是设置为undefined,一个是真正的删除了。
十二、JavaScript中16进制与10进制相互转换
var sHex=(255).toString(16);//ff
var iNum=parseInt("ff",16);//255
十三、JavaScript多行字符串
如何在JavaScript中方便地写一个多行字符串呢,有三种方案,你自己选吧:
//one
var testHtml="a"+
"b"+
"c";
//two
var testHtml2="a\
b\
c";
//three
var testHtml3=["a",
"b",
"c"].join("");
十四、JavaScript中!!操作符是什么
console.log(!!10);//true
console.log(!!0);//false
console.log(!!"abc");//true
console.log(!!"");//false
简单地说就是把右侧的值转为bool值
十五、JavaScript实现endsWith
String.prototype.endsWith = function(suffix) {
return this.indexOf(suffix, this.length - suffix.length) !== -1;
};
//or
function endsWith(str, suffix) {
return str.indexOf(suffix, str.length - suffix.length) !== -1;
}
十六、JavaScript中克隆对象
function clone(obj) {
// Handle the 3 simple types, and null or undefined
if (null == obj || "object" != typeof obj) return obj;
// Handle Date
if (obj instanceof Date) {
var copy = new Date();
copy.setTime(obj.getTime());
return copy;
}
// Handle Array
if (obj instanceof Array) {
var copy = [];
for (var i = 0, var len = obj.length; i < len; ++i) {
copy[i] = clone(obj[i]);
}
return copy;
}
// Handle Object
if (obj instanceof Object) {
var copy = {};
for (var attr in obj) {
if (obj.hasOwnProperty(attr)) copy[attr] = clone(obj[attr]);
}
return copy;
}
throw new Error("Unable to copy obj! Its type isn't supported.");
}
十七、JavaScript字符与ASCII码间的转换
console.log("\n".charCodeAt(0));//10
console.log(String.fromCharCode(65));//A
十八、JavaScript中浮点数的相等判断不能用 ==
console.log(0.1+0.2 == 0.3);//false
console.log(Math.abs(0.1+0.2 - 0.3) < 0.000001);//true
如上所示,浮点数相等判断要用差的绝对值小于某一个数来判断。至于原因可以参考这里:http://docs.oracle.com/cd/E19957-01/806-3568/ncg_goldberg.html
十九、JavaScript中base64编码
var Base64 = {
// private property
_keyStr : "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=",
// public method for encoding
encode : function (input) {
var output = "";
var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
var i = 0;
input = Base64._utf8_encode(input);
while (i < input.length) {
chr1 = input.charCodeAt(i++);
chr2 = input.charCodeAt(i++);
chr3 = input.charCodeAt(i++);
enc1 = chr1 >> 2;
enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
enc4 = chr3 & 63;
if (isNaN(chr2)) {
enc3 = enc4 = 64;
} else if (isNaN(chr3)) {
enc4 = 64;
}
output = output +
this._keyStr.charAt(enc1) + this._keyStr.charAt(enc2) +
this._keyStr.charAt(enc3) + this._keyStr.charAt(enc4);
}
return output;
},
// public method for decoding
decode : function (input) {
var output = "";
var chr1, chr2, chr3;
var enc1, enc2, enc3, enc4;
var i = 0;
input = input.replace(/[^A-Za-z0-9\+\/\=]/g, "");
while (i < input.length) {
enc1 = this._keyStr.indexOf(input.charAt(i++));
enc2 = this._keyStr.indexOf(input.charAt(i++));
enc3 = this._keyStr.indexOf(input.charAt(i++));
enc4 = this._keyStr.indexOf(input.charAt(i++));
chr1 = (enc1 << 2) | (enc2 >> 4);
chr2 = ((enc2 & 15) << 4) | (enc3 >> 2);
chr3 = ((enc3 & 3) << 6) | enc4;
output = output + String.fromCharCode(chr1);
if (enc3 != 64) {
output = output + String.fromCharCode(chr2);
}
if (enc4 != 64) {
output = output + String.fromCharCode(chr3);
}
}
output = Base64._utf8_decode(output);
return output;
},
// private method for UTF-8 encoding
_utf8_encode : function (string) {
string = string.replace(/\r\n/g,"\n");
var utftext = "";
for (var n = 0; n < string.length; n++) {
var c = string.charCodeAt(n);
if (c < 128) {
utftext += String.fromCharCode(c);
}
else if((c > 127) && (c <)) {
utftext += String.fromCharCode((c >> 6) | 192);
utftext += String.fromCharCode((c & 63) | 128);
}
else {
utftext += String.fromCharCode((c >> 12) | 224);
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
utftext += String.fromCharCode((c & 63) | 128);
}
}
return utftext;
},
// private method for UTF-8 decoding
_utf8_decode : function (utftext) {
var string = "";
var i = 0;
var c = c1 = c2 = 0;
while ( i < utftext.length ) {
c = utftext.charCodeAt(i);
if (c < 128) {
string += String.fromCharCode(c);
i++;
}
else if((c > 191) && (c <)) {
c2 = utftext.charCodeAt(i+1);
string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
i += 2;
}
else {
c2 = utftext.charCodeAt(i+1);
c3 = utftext.charCodeAt(i+2);
string += String.fromCharCode(((c & 15) << 12) | ((c2 & 63) << 6) | (c3 & 63));
i += 3;
}
}
return string;
}
}
//encode
Base64.encode("Test"); //VGVzdA==
//decode
Base64.decode("VGVzdA=="); // Test
二十、jQuery中each跟map的区别
each跟map都可以用来遍历Array或Object,区别是each不改变原来的Array或Object,map是操作给定的Array或Object返回一个新Array或Object。Demo:
var items = [1,2,3,4];
$.each(items, function() {
alert('this is ' + this);//alert 1,2,3,4
});
var newItems = $.map(items, function(i) {
return i + 1;
});
// newItems is [2,3,4,5]
map会占用更多的内存,所以如果只是遍历建议用each。
二十一、判断一个对象是否为数组
function isArray(obj){
return Object.prototype.toString.call(obj) == "[object Array]";
}
不能用instanceof 和 constructor来判断,原因参考:http://perfectionkills.com/instanceof-considered-harmful-or-how-to-write-a-robust-isarray/
二十二、通过原型继承创建一个新对象
function inherit(p){
if(!p){
throw TypeError("p is not an object or null");
}
if(Object.create){
return Object.create(p);
}
var t=typeof p;
if(t !== "object" && t !== "function"){
throw TypeError("p is not an object or null");
}
function f(){};
f.prototype=p;
return new f();
}
原创来自:http://www.cnblogs.com/jscode/archive/2012/07/25/2605395.html
这些年,我收集的JavaScript代码(一)的更多相关文章
- 这些年,我收集的JavaScript代码
这些年,我收集的JavaScript代码(一) http://www.cnblogs.com/jscode/archive/2012/07/25/2605395.html 这些年,我收集的JavaSc ...
- 精心收集的 48 个 JavaScript 代码片段,仅需 30 秒就可理解!
原文:https://github.com/Chalarangelo/30-seconds-of-code#anagrams-of-string-with-duplicates 作者:Chalaran ...
- 精心收集的 48 个 JavaScript 代码片段,仅需 30 秒就可理解
原文:Chalarangelo 译文:IT168 https://github.com/Chalarangelo/30-seconds-of-code#anagrams-of-string-with ...
- 精心收集的48个JavaScript代码片段,仅需30秒就可理解
源文链接 :https://github.com/Chalarangelo/30-seconds-of-code#anagrams-of-string-with-duplicates 该项目来自于 G ...
- 前端福利!10个短小却超实用的JavaScript 代码段
JavaScript正变得越来越流行,它已经成为前端开发的第一选择,并且利用基于JavaScript语言的NodeJS,我们也可以开发出高 性能的后端服务,甚至我还看到在硬件编程领域也出现了JavaS ...
- 可进行JavaScript代码测试与调试的12个网站
概述:JavaScript是网站前端开发最为重要的一门编程语言,本文收集了能够在线测试与调试JavaScript代码的12个网站 1.JS Bin JS bin是一个为JavaScript和CSS爱好 ...
- 只有20行Javascript代码!手把手教你写一个页面模板引擎
http://www.toobug.net/article/how_to_design_front_end_template_engine.html http://barretlee.com/webs ...
- 引爆你的Javascript代码进化
转自:http://www.hicss.net/evolve-your-javascript-code/ 方才在程序里看到一段JS代码,写法极为高明,私心想着若是其按照规范来写,定可培养对这门语言的理 ...
- 提高你的javascript代码逼格系列之函数与数组
不知道大家有没有一种感觉,那就是自己写的javascript代码虽然能完全解决工作上的需要,但是,一眼望去,too simple!!!简直就是一个傻子都能看懂的水平,于是,在工作之余,我开始去收集一些 ...
随机推荐
- 在world中批量调整图片的大小
1.Alt+F8调出vb宏 创建一个宏名字,setsize 粘贴代码后保存关闭. Sub setsize() ' ' setsize 宏 ' ' Dim iSha As InlineShape Fo ...
- Android进程
android进程等级 1.前台进程 2.可视进程 3.服务进程 4.后台进程 5.空进程 让应用退出方式 finish();让应用成为空进程 Process.killProcess();杀进程 sy ...
- Chapter 02:复合 VS 继承
复合优先于继承,继承是实现代码重用的有力手段,并不是所有情况都适用,使用不当会导致软件变得很脆弱.与方法调用不同的是,继承打破了封装性. 总而言之,组合和继承,都能实现对类的扩展.但是要分具体情况用哪 ...
- python super研究
# encoding=utf-8 class A(object): def __init__(self): print "初始化a" def run(self): print &q ...
- PHP简单socket编程
今天再看一点邮件发送的功能,所以了解一下socket变成,看到了一篇不错的文章,转发过来做个笔记吧. 原文链接:http://www.cnblogs.com/thinksasa/archive/201 ...
- 百度地图V2.0实践项目开发工具类bmap.util.js V1.4
/** * 百度地图使用工具类-v2.0(大眾版) * * @author boonya * @date 2013-7-7 * @address Chengdu,Sichuan,China * @em ...
- linux之SQL语句简明教程---Alias
接下来,我们讨论 alias (别名) 在 SQL 上的用处.最常用到的别名有两种: 栏位别名及表格别名. 简单地来说,栏位别名的目的是为了让 SQL 产生的结果易读.在之前的例子中,每当我们有营业额 ...
- 数据结构--队列之C数组实现
队列是一种限定操作的线性表,它只能在表的一段插入,另外一段取出.所以也称为先进先出数据结构(FIFO---First In First Out) C代码如下: #include<stdio.h& ...
- 杭电oj1219 AC Me
Tips:本题中,输入字符串之后,直接从头到尾处理一遍,调用函数判断是否是字母,不要自己写循环判断是否为字母,易超时! 不过本题中有一个疑问,自己最开始用C写的,一直是Time Limit Excee ...
- DBS小结
<数据库系统原理>主要介绍的是数据库技术的基本原理.方法和应用技术. 它可以使我们能有效地使用现有的数据库管理系统和软件开发工具,掌握数据库结构的设计和数据库应用系统的开发原理. 在这里, ...