100个直接可以拿来用的JavaScript实用功能代码片段,JavaScript对象与JSON字符串的相互转换

原创地址:

关于json的代码转换可以到这里下载

目录如下:

JSON(JavaScript Object
Notation) 是JavaScript编程语言的一个子集。正因JSON是JavaScript的一个子集,所以它可清晰的运用于此语言中。

1、原生JavaScript实现字符串长度截取
2、原生JavaScript获取域名主机
3、原生JavaScript清除空格
4、原生JavaScript替换全部
5、原生JavaScript转义html标签
6、原生JavaScript还原html标签
7、原生JavaScript时间日期格式转换
8、原生JavaScript判断是否为数字类型
9、原生JavaScript设置cookie值
10、原生JavaScript获取cookie值
11、原生JavaScript加入收藏夹
12、原生JavaScript设为首页
13、原生JavaScript判断IE6
14、原生JavaScript加载样式文件
15、原生JavaScript返回脚本内容
16、原生JavaScript清除脚本内容
17、原生JavaScript动态加载脚本文件
18、原生JavaScript返回按ID检索的元素对象
19、原生JavaScript返回浏览器版本内容
20、原生JavaScript元素显示的通用方法
21、原生JavaScript中有insertBefore方法,可惜却没有insertAfter方法?用如下函数实现
22、原生JavaScript中兼容浏览器绑定元素事件
23、原生JavaScript光标停在文字的后面,文本框获得焦点时调用
24、原生JavaScript检验URL链接是否有效
25、原生JavaScript格式化CSS样式代码
26、原生JavaScript压缩CSS样式代码
27、原生JavaScript获取当前路径
28、原生JavaScriptIP转成整型
29、原生JavaScript整型解析为IP地址
30、原生JavaScript实现checkbox全选与全不选
31、原生JavaScript判断是否移动设备
32、原生JavaScript判断是否移动设备访问
33、原生JavaScript判断是否苹果移动设备访问
34、原生JavaScript判断是否安卓移动设备访问
35、原生JavaScript判断是否Touch屏幕
36、原生JavaScript判断是否在安卓上的谷歌浏览器
37、原生JavaScript判断是否打开视窗
38、原生JavaScript获取移动设备初始化大小
39、原生JavaScript获取移动设备最大化大小
40、原生JavaScript获取移动设备屏幕宽度
41、原生JavaScript完美判断是否为网址
42、原生JavaScript根据样式名称检索元素对象
43、原生JavaScript判断是否以某个字符串开头
44、原生JavaScript判断是否以某个字符串结束
45、原生JavaScript返回IE浏览器的版本号
46、原生JavaScript获取页面高度
47、原生JavaScript获取页面scrollLeft
48、原生JavaScript获取页面可视宽度
49、原生JavaScript获取页面宽度
50、原生JavaScript获取页面scrollTop
51、原生JavaScript获取页面可视高度
52、原生JavaScript跨浏览器添加事件
53、原生JavaScript跨浏览器删除事件
54、原生JavaScript去掉url前缀
55、原生JavaScript随机数时间戳
56、原生JavaScript全角半角转换,iCase: 0全到半,1半到全,其他不转化
57、原生JavaScript确认是否键盘有效输入值
58、原生JavaScript获取网页被卷去的位置
59、原生JavaScript另一种正则日期格式化函数+调用方法
60、原生JavaScript时间个性化输出功能
61、原生JavaScript解决offsetX兼容性问题
62、原生JavaScript常用的正则表达式
63、原生JavaScript实现返回顶部的通用方法
64、原生JavaScript获得URL中GET参数值
65、原生JavaScript实现全选通用方法
66、原生JavaScript实现全部取消选择通用方法
67、原生JavaScript实现打开一个窗体通用方法
68、原生JavaScript判断是否为客户端设备
69、原生JavaScript获取单选按钮的值
70、原生JavaScript获取复选框的值
71、原生JavaScript判断是否为邮箱
72、原生JavaScript判断是否有列表中的危险字符
73、原生JavaScript判断字符串是否大于规定的长度
74、原生JavaScript判断字符串是为网址不区分大小写
75、原生JavaScript判断字符串是否为小数
76、原生JavaScript判断字符串是否为整数
77、原生JavaScript判断字符串是否为浮点数
78、原生JavaScript判断字符是否为A-Za-z英文字母
79、原生JavaScript判断字符串是否邮政编码
80、原生JavaScript判断字符是否空NULL
81、原生JavaScript用正则表达式提取页面代码中所有网址
82、原生JavaScript用正则表达式清除相同的数组(低效率)
83、原生JavaScript用正则表达式清除相同的数组(高效率)
84、原生JavaScript用正则表达式按字母排序,对每行进行数组排序
85、原生JavaScript字符串反序
86、原生JavaScript用正则表达式清除html代码中的脚本
87、原生JavaScript动态执行JavaScript脚本
88、原生JavaScript动态执行VBScript脚本
89、原生JavaScript实现金额大写转换函数
90、原生JavaScript常用的正则表达式大收集
91、原生JavaScript实现窗体改变事件resize的操作(兼容所以的浏览器)
92、原生JavaScript用正则清除空格分左右
93、原生JavaScript判断变量是否空值
94、原生JavaScript实现base64解码
95、原生JavaScript实现utf8解码
96、原生JavaScript获取窗体可见范围的宽与高
97、原生JavaScript判断IE版本号(既简洁、又向后兼容!)
98、原生JavaScript获取浏览器版本号
99、原生JavaScript半角转换为全角函数

eval函数 JSON文本转换为对象
    为了将JSON文本转换为对象,可以使用eval函数。eval函数调用JavaScript编辑器。由于JSON是JavaScript的子集,因此编译器将正确的解析文本并产生对象结构。文本必须括在括号中避免产生JavaScript的语法歧义。
var obj = eval(‘(‘ + JSONTest + ‘)’);
    eval函数非常快速。它可以编译执行任何JavaScript程序,因此产生了安全性问题。当使用可信任与完善的源代码时才可以使用eval函数。这样可以更安全的解析JSON文本。使用XmlHttp的web应用,页面之间的通讯只允许同源,因此是可以信任的。但这却不是完善的。如果服务器没有严谨的JSON编码,或者没有严格的输入验证,那么可能传送包括危险脚本的无效JSON文本。eval函数将执行恶意的脚本。

 (bootstrap 字体图标)

100、原生JavaScript全角转换为半角函数

JSON解释器 JSON.parse、JSON.stringify
    使用JSON解析器可以防止像eval函数转换JSON文本为对象那样的安全隐患。JSON解析器只能辨识JSON文本,拒绝所有脚本。提供了本地JSON支持的浏览器的JSON解析器将远快于eval函数。
目前,Firefox、Opera、IE8以上版本也提供了本地JSON支持。其中,JSON解释器提供的函数有:JSON.parse、JSON.stringify。
    对于那些并不提供本地JSON支持的浏览器可以引入脚本json2.js,来实现JSON转换功能。json2.js脚本可到

//—————UI——————

 

JSON.parse 函数
将JSON文本转换为对象。
JSON.parse(text[, reviver])

1、原生JavaScript实现字符串长度截取

参数
text
   必选项。要转换为对象的JSON文本。
reviver
   可选项。该参数是个替换函数。在转换中,遍历的每个节点,都将执行该函数,该函数的返回值将替代转换结果的相应节点值。

图片 1图片 2

JSON.stringify 函数
将对象转换为JSON文本。
JSON.stringify(value[, replacer[, space]])


 1    function cutstr(str, len) {  2         var temp;  3         var icount = 0;  4         var patrn = /[^\x00-\xff]/;  5         var strre = "";  6         for (var i = 0; i < str.length; i++) {  7             if (icount < len - 1) {  8                 temp = str.substr(i, 1);  9                 if (patrn.exec(temp) == null) { 10                     icount = icount + 1 11                 } else { 12                     icount = icount + 2 13                 } 14                 strre += temp 15             } else { 16                 break 17             } 18         } 19         return strre + "..." 20     }

参数
text
必选项。要转换为JSON文本的对象。
reviver
   可选项。该参数是个替换函数。在转换中,遍历的每个节点,都将执行该函数,该函数的返回值将替代转换结果的相应节点值。
space
   可选项。格式化输出JSON文本缩进的空格数量。如果不提供该参数将不会格式化输出。

View Code

参数reviver的委托类型
reviver(key, value)
reviver函数的中的this是当前所遍历到的节点的父节点。当所遍历的是根节点的时候,父节点是个Object对象,根节点是该对象的一个属性,属性名是空字符串。

 

参数
key
   当父节点是数组Object,key为数组索引,否则key为Object属性名。
value
   节点值。

2、原生JavaScript获取域名主机

注:JSON不支持循环数据结构。

图片 3图片 4

JSON.parse、JSON.stringify使用示例
<script type=”text/javascript”>
function InventoryItem(parm) {
   this.Product = parm.Product
   this.Quantity = parm.Quantity;
   this.Price = parm.Price;
   this.Type = parm.Type;
   this.Total = function() {
      return this.Price * this.Quantity;
   }
}

 1     function getHost(url) {  2         var host = "null";  3         if(typeof url == "undefined"|| null == url) {  4             url = window.location.href;  5         }  6         var regex = /^\w+\:\/\/([^\/]*).*/;  7         var match = url.match(regex);  8         if(typeof match != "undefined" && null != match) {  9             host = match[1]; 10         } 11         return host; 12 }

function Inventory(parm) {
   this.Date = parm.Date;
   this.Item = parm.Item;
   this.Type = parm.Type;
   this.Total = function() {
      var count = 0;
      for (var key in this.Item) {
         count += this.Item[key].Total();
      }
      return count;
   }
}

View Code

var inventoryJSONText =
“{\”Date\”:\”2000-01-01\”,\”Item\”:[{\”Product\”:\”ProductOne\”,\”Quantity\”:\”10\”,\”Price\”:\”10\”,\”Type\”:\”InventoryItem\”},{\”Product\”:\”ProductTwo\”,\”Quantity\”:\”100\”,\”Price\”:\”20\”,\”Type\”:\”InventoryItem\”}],\”Type\”:\”Inventory\”}”;

 

//将JSON文本转换为对象,并将一般类的实例改成伪类的实例。
var inventoryObject = JSON.parse(inventoryJSONText, function(key, value)
{
   var type;
   if (value && typeof value === ‘object’) {
      type = value.Type;
      if (typeof type === ‘string’ && typeof window[type] ===
‘function’) {
         return new (window[type])(value);
      }
   }
   return value;
});

3、原生JavaScript清除空格

//输出转换后对象的信息。
var output = “Product\t\tQuantity\tPrice\tTotal\n”;
for (var key in inventoryObject.Item) {
   var item = inventoryObject.Item[key];
   output += item.Product + “\t” + item.Quantity + “\t\t” +
item.Price + “\t” + item.Total() + “\n”;
}
output += “\t\t\t\t\t” + inventoryObject.Total();
alert(output);

图片 5图片 6

//再将inventoryObject对象转换成JSON文本。
var inventoryJSONTextAgain = JSON.stringify(inventoryObject, null, 3);
alert(inventoryJSONTextAgain);
</script>

1   String.prototype.trim = function() { 2         var reExtraSpace = /^\s*(.*?)\s+$/; 3         return this.replace(reExtraSpace, "$1") 4     }

来自:

View Code



4、原生JavaScript替换全部

图片 7图片 8

1     String.prototype.replaceAll = function(s1, s2) { 2         return this.replace(new RegExp(s1, "gm"), s2) 3     }

View Code


5、原生JavaScript转义html标签

图片 9图片 10

1 function HtmlEncode(text) { 2         return text.replace(/&/g, '&amp').replace(/\"/g, '&quot;').replace(/</g, '&lt;').replace(/>/g, '&gt;') 3     }

View Code

 
6、原生JavaScript还原html标签

图片 11图片 12

1 function HtmlDecode(text) { 2         return text.replace(/&amp;/g, '&').replace(/&quot;/g, '\"').replace(/&lt;/g, '<').replace(/&gt;/g, '>') 3     }

View Code

 
7、原生JavaScript时间日期格式转换

图片 13图片 14

 1     Date.prototype.Format = function(formatStr) {  2         var str = formatStr;  3         var Week = ['日', '一', '二', '三', '四', '五', '六'];  4         str = str.replace(/yyyy|YYYY/, this.getFullYear());  5         str = str.replace(/yy|YY/, (this.getYear() % 100) > 9 ? (this.getYear() % 100).toString() : '0' + (this.getYear() % 100));  6         str = str.replace(/MM/, (this.getMonth() + 1) > 9 ? (this.getMonth() + 1).toString() : '0' + (this.getMonth() + 1));  7         str = str.replace(/M/g, (this.getMonth() + 1));  8         str = str.replace(/w|W/g, Week[this.getDay()]);  9         str = str.replace(/dd|DD/, this.getDate() > 9 ? this.getDate().toString() : '0' + this.getDate()); 10         str = str.replace(/d|D/g, this.getDate()); 11         str = str.replace(/hh|HH/, this.getHours() > 9 ? this.getHours().toString() : '0' + this.getHours()); 12         str = str.replace(/h|H/g, this.getHours()); 13         str = str.replace(/mm/, this.getMinutes() > 9 ? this.getMinutes().toString() : '0' + this.getMinutes()); 14         str = str.replace(/m/g, this.getMinutes()); 15         str = str.replace(/ss|SS/, this.getSeconds() > 9 ? this.getSeconds().toString() : '0' + this.getSeconds()); 16         str = str.replace(/s|S/g, this.getSeconds()); 17         return str 18     }

View Code


8、原生JavaScript判断是否为数字类型

图片 15图片 16

1 function isDigit(value) { 2         var patrn = /^[0-9]*$/; 3         if (patrn.exec(value) == null || value == "") { 4             return false 5         } else { 6             return true 7         } 8     }

View Code


9、原生JavaScript设置cookie值

图片 17图片 18

1 function setCookie(name, value, Hours) { 2             var d = new Date(); 3         var offset = 8; 4         var utc = d.getTime() + (d.getTimezoneOffset() * 60000); 5         var nd = utc + (3600000 * offset); 6         var exp = new Date(nd); 7         exp.setTime(exp.getTime() + Hours * 60 * 60 * 1000); 8         document.cookie = name + "=" + escape(value) + ";path=/;expires=" + exp.toGMTString() + ";domain=360doc.com;" 9     }

View Code


10、原生JavaScript获取cookie值

图片 19图片 20

1     function getCookie(name) { 2         var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)")); 3         if (arr != null) return unescape(arr[2]); 4         return null 5     }

View Code


11、原生JavaScript加入收藏夹

图片 21图片 22

 1 function AddFavorite(sURL, sTitle) {  2         try {  3             window.external.addFavorite(sURL, sTitle)  4         } catch(e) {  5             try {  6                 window.sidebar.addPanel(sTitle, sURL, "")  7             } catch(e) {  8                 alert("加入收藏失败,请使用Ctrl+D进行添加")  9             } 10         } 11     }

View Code

 
12、原生JavaScript设为首页

图片 23图片 24

 1 function setHomepage() {  2         if (document.all) {  3             document.body.style.behavior = 'url(#default#homepage)';  4             document.body.setHomePage('http://www.jq-school.com')  5         } else if (window.sidebar) {  6             if (window.netscape) {  7                 try {  8                     netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect")  9                 } catch(e) { 10                     alert("该操作被浏览器拒绝,如果想启用该功能,请在地址栏内输入 about:config,然后将项 signed.applets.codebase_principal_support 值该为true") 11                 } 12             } 13             var prefs = Components.classes['@mozilla.org/preferences-service;1'].getService(Components.interfaces.nsIPrefBranch); 14             prefs.setCharPref('browser.startup.homepage', 'http://www.jq-school.com') 15         } 16     }

View Code

 
13、原生JavaScript判断IE6

图片 25图片 26

1 var ua = navigator.userAgent.toLowerCase(); 2     var isIE6 = ua.indexOf("msie 6") > -1; 3     if (isIE6) { 4         try { 5             document.execCommand("BackgroundImageCache", false, true) 6         } catch(e) {} 7     }

View Code

 
14、原生JavaScript加载样式文件

图片 27图片 28

 1 function LoadStyle(url) {  2         try {  3             document.createStyleSheet(url)  4         } catch(e) {  5             var cssLink = document.createElement('link');  6             cssLink.rel = 'stylesheet';  7             cssLink.type = 'text/css';  8             cssLink.href = url;  9             var head = document.getElementsByTagName('head')[0]; 10             head.appendChild(cssLink) 11         } 12     }

View Code

 

15、原生JavaScript返回脚本内容

图片 29图片 30

 1 function evalscript(s) {  2         if(s.indexOf('<script') == -1) return s;  3         var p = /<script[^\>]*?>([^\x00]*?)<\/script>/ig;  4         var arr = [];  5         while(arr = p.exec(s)) {  6             var p1 = /<script[^\>]*?src=\"([^\>]*?)\"[^\>]*?(reload=\"1\")?(?:charset=\"([\w\-]+?)\")?><\/script>/i;  7             var arr1 = [];  8             arr1 = p1.exec(arr[0]);  9             if(arr1) { 10                 appendscript(arr1[1], '', arr1[2], arr1[3]); 11             } else { 12                 p1 = /<script(.*?)>([^\x00]+?)<\/script>/i; 13                 arr1 = p1.exec(arr[0]); 14                 appendscript('', arr1[2], arr1[1].indexOf('reload=') != -1); 15             } 16         } 17         return s; 18     }

View Code

 

16、原生JavaScript清除脚本内容

图片 31图片 32

1 function stripscript(s) { 2         return s.replace(/<script.*?>.*?<\/script>/ig, ''); 3     }

View Code

 

17、原生JavaScript动态加载脚本文件

图片 33图片 34

 1 function appendscript(src, text, reload, charset) {  2         var id = hash(src + text);  3         if(!reload && in_array(id, evalscripts)) return;  4         if(reload && $(id)) {  5             $(id).parentNode.removeChild($(id));  6         }  7        8         evalscripts.push(id);  9         var scriptNode = document.createElement("script"); 10         scriptNode.type = "text/javascript"; 11         scriptNode.id = id; 12         scriptNode.charset = charset ? charset : (BROWSER.firefox ? document.characterSet : document.charset); 13         try { 14             if(src) { 15                 scriptNode.src = src; 16                 scriptNode.onloadDone = false; 17                 scriptNode.onload = function () { 18                     scriptNode.onloadDone = true; 19                     JSLOADED[src] = 1; 20                 }; 21                 scriptNode.onreadystatechange = function () { 22                     if((scriptNode.readyState == 'loaded' || scriptNode.readyState == 'complete') && !scriptNode.onloadDone) { 23                         scriptNode.onloadDone = true; 24                         JSLOADED[src] = 1; 25                     } 26                 }; 27             } else if(text){ 28                 scriptNode.text = text; 29             } 30             document.getElementsByTagName('head')[0].appendChild(scriptNode); 31         } catch(e) {} 32     }

View Code

 

相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注