随笔分类 - bootsharp
bootsharp
摘要：js实现N个元素的排列组合及存在相同元素的处理方法
不能有相同的元素,相同号码替换成对应字母处理
阅读全文
摘要：js获取url原有参数，增加页面select值拼接url后跳转页面，获取对象keyValue方法，get提交html5页面模版
阅读全文
摘要：jQuery图片懒加载插件jquery.lazyload.js使用实例注意事项说明
jquery.lazyload.js是一个用JavaScript编写的jQuery插件。它可以延迟加载长页面中的图片，在浏览器可视区域外的图片不会被载入。
直到用户将页面滚动到它们所在的位置，这与图片预加载的处理方式正好是相反的。
在包含很多大图片长页面中延迟加载图片可以加快页面加载速度，浏览器将会在加载可见图片之后即进入就绪状态，在淘宝商品详情页、漫画网站很多图片的情况下还可以帮助降低服务器负担。
阅读全文
摘要：JS中的函数节流throttle详解和优化
在前端开发中，有时会为页面绑定resize事件，或者为一个页面元素绑定拖拽事件（mousemove），这种事件有一个特点，在一个正常的操作中，有可能在一个短的时间内触发非常多次事件绑定程序。
DOM操作时很消耗性能的，如果你为这些事件绑定一些操作DOM节点的操作的话，那就会引发大量的计算，在用户看来，页面可能就一时间没有响应，这个页面一下子变卡了变慢了。在IE下，如果你绑定的resize事件进行较多DOM操作可能直接就崩溃了。
怎么解决？函数节流(throttle)就是一种办法。
阅读全文
摘要：jQuery懒加载插件jquery.lazyload.js使用说明实例
很多网站都会用到‘图片懒加载’这种方式对网站进行优化，即延迟加载图片或符合某些条件才开始加载图片。
懒加载原理：浏览器会自动对页面中的img标签的src属性发送请求并下载图片。通过动态改变img的src属性实现。
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件。
它可以延迟加载长页面中的图片在浏览器可视区域外的图片不会被载入，直到用户将页面滚动到它们所在的位置。
与图片预加载的处理方式相反，在包含很多大图片长页面中延迟加载图片可以加快页面加载速度，尤其是移动端。
浏览器将会在加载可见图片之后即进入就绪状态，在淘宝商品详情页、漫画网站很多图片的情况下还可以帮助降低服务器负担。
一、下载和引用
官网下载地址：http://plugins.jquery.com/lazyload/ 下载2014年最后更新的1.9.3即可
Lazy Load 依赖于 jQuery. 所以需要先引用jqueryjs：
二、实例调用
要使用懒加载，需要改变img的src标签
img alt="" wi
阅读全文
摘要：CSS, JavaScript 压缩, 美化, 加密, 解密
JS压缩, CSS压缩, javascript compress, js在线压缩，javascript在线压缩，css在线压缩，YUI Compressor压缩，Google Closure Compiler压缩，js压缩，uglifyjs压缩，javascript压缩，js美化，javascript美化，js加密，js解密，js混淆，javascript加密，javascript解密，js格式化，javascript格式化
阅读全文
摘要：bootsrtap h5 移动版页面 在苹果手机ios滑动上下拉动滚动卡顿问题解决方法。排除网页结果问题，布局问题，js问题，样式问题，内容长度问题，所以当时想到的地方都改过测试了也没有解决。
最后只能认为的苹果手机ios的兼容性问题了，按照苹果手机 ios 拉动 卡顿 触屏 去搜索还真搜索到了很多相关问题，很多人遇到ios卡顿问题，但把网上所有方法都试了一遍也还是没有解决。在准备放弃的时候突然调试成功了，成功代码如下
阅读全文
摘要：高级前端面试题，部分答案待补充，有好的答案可留言提供。
跨域请求原理，基本数据类型，grunt实时刷新
阅读全文
摘要：前端Html和Css面试题
Html篇：1.你做的页面在哪些流览器测试过？这些浏览器的内核分别是什么?
Css篇：1.有哪项方式可以对一个DOM设置它的CSS样式？
阅读全文
摘要：各种前后端技术关键词杂谈
react native可以把android和ios串起来，javascript可以把react native、react.js和node.js串起来。
新语言开发效率比较高但坑还是比较多的，不过java开发效率确实太慢了，php比较居中，python还是不错的，可以用的项目很多，爬虫、自动化运维、人工智能很多都用到python开发。
后端开发用得比较多的是：java php python nodejs go c# ruby等
桌面版的和网络底层用C/C++还是比较多，python也可以做一部分，大数据数据分析神经网络用matlab、R语言的也不少，nodejs一般只用在高并发，通信部分，不是做全部后端的。
移动开发原生基本是ios(Objective-C、Swift)、android，兼容性开发的主要有：react native、PhoneGap、Hybird模式
NodeJS：nodejs、Express、WebStorm 集成Node.js ,可以运行，编译，测试Node.js App。
阅读全文
摘要：关于web开发前端h5框架的选择
看了很多移动版框架都是基于app混合式开发的，不是单独h5网站的
基于h5开发的web框架从组件丰富度，兼容性，相关教程来说bootstrap还是最好的
react和vue2都是用mvvm模式，数据实时更新，适合app里面嵌入的网页使用，但用在传统web网页上对seo不太好，因为数据都放在js里面了，页面html只有简单的结构了。bootstrap比较符合web网站做seo的，兼容跨屏的同时又能保持数据输出。
js框架性能测试对比Table Report
http://stefankrause.net/js-frameworks-benchmark4/webdriver-ts/table.html
阅读全文
摘要：前端js,css文件合并三种方式,bat命令
前端js文件该如何合并三个方式如下：
1. 一个大文件，所有js合并成一个大文件，所有页面都引用它。
2. 各个页面大文件，各自页面合并生成自己所需js的大文件。
3. 合并多个共用大文件，根据实践情况合并出多个共用js文件，每个页面引用多个共用大文件。
合并两个目的：
1. 为了减少请求数。
2. 代码安全考虑（文件分得越多，越容易被人看清）。
PS：不是压缩混淆，只是合并
阅读全文
摘要：bootstrap导航条在手机上默认展开二级目录,必须用setTimeout才能实现
$('#nav-topbar-btn').click(function(){
setTimeout(function(){$('.dropdown').addClass('open');},10);
});
阅读全文
摘要：bootstrap实现 手机端滑动效果，滑动到下一页，jgestures.js插件
jgestures.js插件可以解决，只需要引入一个JS文件
下面是JS代码：
$(document).ready(function(){
//手势右滑
$('#myCarousel').bind('swiperight swiperightup swiperightdown',function(){
// 执行一些动作...
})
//手势左滑
$('#myCarousel').bind('swipeleft swipeleftup swipeleftdown',function(){
// 执行一些动作...
})
//单点滑动手势,滑动完成后触发(一个手指在屏幕上移动)
$('#myCarousel').bind('swipeone',function(){
// 执行一些动作...
})
});
阅读全文
摘要：jquery选择器中两个class是什么意思？
$(".class1 .class2") 选择class1元素下class2的元素（中间有空格）
$(".class1.class2") 选择同时含有class1和class2的元素（中间没有空格）
$(".class1,.class2") 选择class1或者class2的元素（中间有逗号）
jQuery的选择器和css选择器基本一样，例如：
css选择多个class为：.class1.class2
jQuery选择多个class为：$(".class1.class2")
阅读全文
摘要：升级到php7相关问题，日请求过亿QQ会员活动平台PHP7升级实践
ThinkPHP5.0也是全新架构的了，性能也是大幅提升的
用ThinkPHP3.2版本的代码完全无法升级到5.0上使用的
刚查了下，CI 4.0基于php7重新架构的现在还没有发布
CI 4.0 也是声明是颠覆性的升级，不向下兼容的
看来升级到php7 基本上连带着所有框架插件都得重新搞一套了
这次是全面大升级，互联网，移动互联网发展太快了，必须得跟着升级，不然完全跟不上业务发展需求
php7.0性能比php5.6提升8倍，而php5.6 5.5 比之前的5.4又提升好几倍的，比5.3就提升更多了，对需要多台服务器的来说直接就节省了一大半服务器费用开支了
阅读全文
摘要：多屏适应响应式布局方案,响应式、自适应布局区别 完整的思维导图
基于webview的Hybrid App混合开发模式，facebook开源的React Native，bootsrtap响应式布局
阅读全文
摘要：Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。全球数以百万计的网站都是基于 Bootstrap 构建的。
Bootstrap 为所有开发者、所有应用场景而设计，所有开发者都能快速上手、所有设备都可以适配、所有项目都适用。
简洁、直观、强大的开发框架，有众多插件，让Web开发更快、更容易
阅读全文
摘要：Bootstrap 提供了一套响应式、移动设备优先的流式栅格系统，随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。
栅格系统用于通过一系列的行（row）与列（column）的组合来创建页面布局，你的内容就可以放入这些创建好的布局中。
但在较复杂的页面上出现问题，间隔，内外边距常困扰开发人员，需要深入源码和文档理解栅格系统才能运用自如。
“行（row）”必须包含在 .container （固定宽度）或 .container-fluid （100% 宽度）中，以便为其赋予合适的排列（aligment）和内补（padding）。
Bootstrap 栅格系统的精妙之处, 通过container, row, column都有15px的padding槽边和 row的margin -15px设置，巧妙实现在 column 中嵌套 row进行nesting 扩展(超过12列)，而不需要再套一层 container
阅读全文
摘要：bootstrap介绍,Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。全球数以百万计的网站都是基于 Bootstrap 构建的。
Bootstrap是完全开源的由Twitter @mdo 和 @fat 构建, 采用 LESS CSS, 通过Node编译, 代码托管、开发、维护都在 GitHub 平台上
Bootstrap 为所有开发者、所有应用场景而设计，所有开发者都能快速上手、所有设备都可以适配、所有项目都适用。
简洁、直观、强大的开发框架，有众多插件，让Web开发更快、更容易
阅读全文
