一些杂七杂八的前端相关

最新推荐文章于 2021-11-03 20:08:27 发布

大志天成119

最新推荐文章于 2021-11-03 20:08:27 发布

阅读量242

点赞数

1、最近闭关（封闭式开发），模仿Nodejs造的一个和url相关的小模块，配合做个分页组件很不错：

（1）、获取参数：var id=iurls.query.id或var id=iurls.param('id')；

（2）、设置参数：返回location.search；iurls.setParam(name, value)；

（3）、GET请求：iurls.search({});

var iurls = function (loc){
    var search = loc.search.substr(1);
    var searchArr = search.indexOf('&') != -1 ? search.split('&') : [search];

    function getURLData(k) {
        var param = {};
        for (var i = 0; i < k.length; i++) {
            if (k[i] != "") {
                var v = k[i].split('=');
                for (var j = 0; j < v.length; j++) {
                    var key = decodeURIComponent(v[0]);
                    var value = decodeURIComponent(v[1]);
                    param[key] = value;
                }
            } else {
                return '';
            }
        }
        return param;
    }
    return {
        query: getURLData(searchArr),
        setParam: function(name, value) {
            // return search
            var param = getURLData(searchArr);
            if (param) {
                param[name] = value;
                var parArr = [];
                for (var i in param) {
                    parArr.push(i + '=' + param[i]);
                }
                return parArr.join('&');
            } else {
                return name + '=' + value;
            }
            //location.href=location.pathname+"?"+parArr.join('&');
            //return parArr.join('&');
        },
        param: function(par) {
            return getURLData(searchArr)[par];
        },
        search: function(s) {
            var ur = s.url;
            var data = s.data || {};
            var href = '';
            if (ur) {
                if (ur.indexOf('?') != -1) {
                    href = ur;
                } else {
                    href = ur + '?'
                }
            }
            var datas = [];
            for (var name in data) {
                if (name) {
                    datas.push(name + '=' + data[name]);
                }
            }
            if (href != '') {
                href = href.charAt(href.indexOf('?') + 1) == "" ? href : href + '&';
                location.href = href + datas.join('&');
            } else {
                location.href = loc.pathname + '?' + datas.join('&');
            }
        }
    }   
}(window.location);（<a href="http://www.dztcsd.com/">资质代办</a>）

2、ie9 iframe下静态资源报错，虽然程序能正常运行，但有些系统还是会无法运行；iframe不在页面上，由js输出，解决办法需：动态创建iframe；

3、Sass编译的方式很多，Koala没想用过；Sublime ctrl+b一键可编译；Grunt编译（前端自动化之利剑——Grunt）；Gulp编译（前端自动化之神器 — Gulp）；方式很多的，突然忘记了sass命令行的编译方式，有时也是一种简易的方式：

//（1）、直接编译：sass ./path/*.scss ./path/to/*.css

//（2）、编译后的style：sass --style compressed ./path/*.scss ./path/to/*.css
       * nested：嵌套缩进的css代码，它是默认值。
　　   * expanded：没有缩进的、扩展的css代码。
　　   * compact：简洁格式的css代码。
　　   * compressed：压缩后的css代码。

//（3）、监听文件改动即编译：sass --watch ./path/*.scss:./path/to/*.css

//（4）、sass的运算转换工具：sass -i进入；如进行rgb转16进制，rgb(0,0,0,)输出：#000000；type-of((1,2,3))输出：list;

4、解压文件

var fs = require('fs'),   
    unzip = require('unzip');  
//fs.createReadStream('./angular-swipe-master.zip').pipe(unzip.Extract({ path: './' })); 
var extract = unzip.Extract({ path:  './' });  
extract.on('error', function(err) {  
    console.log(err);  
});  
extract.on('finish', function() {  
    console.log("unziped!!");  
});  
fs.createReadStream('./angular-swipe-master.zip').pipe(extract);

5、压缩文件

var fs = require("fs"); 
var zip = require("node-native-zip"); 
var archive = new zip(); 

archive.addFiles([  
    { name: "app.j", path: "./app.js" }, 
    { name: "package.json", path: "./package.json" } 
], function (err) { 
    if (err) return console.log(err); 
    var buff = archive.toBuffer(); 
    fs.writeFile("./test2.zip", buff, function () { 
        console.log("ziped"); 
    }); 
});（<a href="http://www.dztcsd.com/">资质代办</a>）