推荐10 个短小却超实用的 JavaScript 代码段

使用方法：

if ( isBreakPoint(320) ) { 
// breakpoint at 320 or less 
} 
if ( isBreakPoint(480) ) { 
// breakpoint between 320 and 480 
} 
… 

8. 全局计数

在一些游戏或广告场景中，你需要记录用户在当前页面上点击某一个按钮的次数，这时你可以使用jQuery的.data()函数来处理：

$(element)  
.data('counter', 0) // begin counter at zero  
.click(function() {  
var counter = $(this).data('counter'); // get  
$(this).data('counter', counter + 1); // set  
// do something else...  
}); 

9. 嵌入优酷视频

function embedYouku(link, ops) { 
var o = $.extend({ 
width: 480, 
height: 320, 
params: '' 
}, ops); 
var id = /?v=(w+)/.exec(link)[1]; 
return ' 
} 

使用方法：

embedYouku( 
'http://static.youku.com/v/swf/qplayer.swf', 
{'winType=adshow&VideoIDS=XMTE3NzQ0NTky&isAutoPlay=false&isShowRelatedVideo=false'} 
); 

10. 创建动态菜单或下拉列表

在很多场景中，我们都需要动态地创建菜单、下拉列表或列表项。下面是一段最基础的代码实现上面的功能，你可以根据实际需要进行相应的扩展。

function makeMenu(items, tags) {  
tags = tags || ['ul', 'li']; // default tags  
var parent = tags[0];  
var child = tags[1];  
var item, value = '';  
for (var i = 0, l = items.length; i < l; i++) {  
item = items[i];  
// Separate item and value if value is present  
if (/:/.test(item)) {  
item = items[i].split(':')[0];  
value = items[i].split(':')[1];  
}  
// Wrap the item in tag  
items[i] = '<'+ child +' '+  
(value && 'value="'+value+'"') +'>'+ // add value if present  
item +'';  
}  
return '<'+ parent +'>'+ items.join('') +'';  
} 

使用方法：

// Dropdown select month 
makeMenu( 
['January:JAN', 'February:FEB', 'March:MAR'], // item:value 
['select', 'option'] 
); 
// List of groceries 
makeMenu( 
['Carrots', 'Lettuce', 'Tomatos', 'Milk'], 
['ol', 'li'] 
); 

总结：

以上只是那些实用JavaScript代码段中的一小部分，我也建议你平时注意收集或自己编写这样的基础代码段，它们能在很多项目中使用或通过一些改造提供更完善的功能，使用这些代码段将为你节省下大量的开发时间。

【编辑推荐】

1. 携手开发者智领未来OPPO DEVELOPER DAY 北京站精彩回顾
2. 谷歌上线 Fuchsia OS 开发者网站
3. 新工具一键安装Java环境！微软又双叒叕造福开发者
4. 「大神器！」硬件的AI性能测试Python库发布
5. Linus Torvalds 谈软件开发面临的硬件问题

（编辑：厦门网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!