前端小记

“简单地记一下这段时间所遇到的前端知识点”
1.用于重新计算iframe高度

function getHeight() {
    var iframe = parent.document.getElementById('iframe0');
    var _navLeft = parent.document.getElementById('nav-left');
    if ($(iframe).length > 0) {
        $(iframe).height(getHeightFromIframe(iframe));
        $(_navLeft).height(getHeightFromIframe(iframe) + 102);
        // IE8 下该事件只触发了一次
        if (iframe.attachEvent) {
            iframe.attachEvent("onload", function () {
                $(iframe).height(getHeightFromIframe(iframe));
                $(_navLeft).height(getHeightFromIframe(iframe) + 102);
            });
        } else {
            iframe.onload = function () {
                $(iframe).css("min-height", "530px");
                $(iframe).height(getHeightFromIframe(iframe));
                $(_navLeft).height(getHeightFromIframe(iframe) + 102);
            };
        }
    }
}
function getHeightFromIframe(selector) {
    return $(selector).contents().find('body').height() + 200;
}

2.PC端窗口缩放,页面布局不发生改变,只要在该页面上加上min-width:?px就行了。
3.请求数据(很多种请求数据的方式,这里我只是为自己做个笔记)

function getdata(url, parm, fn, errfn) {
    $.ajax({
        url: urlPrefix + url,
        data: parm,
        type: "POST",
        dataType: "json",
        cache: false,//不取浏览器缓存
        async: true,//异步
        success: function (data) {
            fn(data);
        }, error: function (err) {
            if (err.status == "409") {//系统定义409为session超时,转换提示信息
                alert('用户信息丢失,请重新登录!');
                //window.location.href = "/Login";
            }
            hideloading();
            //alert("出错了" + JSON.stringify(err));
            errfn && errfn(err)
        }, complete: function () {
        }
    });
}

4.获取浏览器地址栏?后面的参数

function getQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg);
    if (r != null) return unescape(r[2]);
    return null;
}

5.iframe的回到顶部

function backtotop() {
    window.parent.scrollTo(0, 0);
}

6.请求页面

function getHTML(url, parm, fun) {
    $.ajax({
        url: urlPrefix + url,    //请求的url地址
        dataType: "html",   //返回格式为json
        async: true, //请求是否异步,默认为异步,这也是ajax重要特性
        data: parm,    //参数值
        type: "GET",   //请求方式
        beforeSend: function () {
            //请求前的处理
        },
        success: function (req) {
            fun(req);
        },
        complete: function () {
        },
        error: function () {
            popWindow(0, '获取页面失败!', 1400);
            $("#about").modal();

        }
    });
}

7.格式化日期

dateForm(new Date()) 获取当前系统时间

//只有一位数时前面补0
function appendzero(obj) {
    if (obj < 10) return "0" + "" + obj;
    else return obj;
}
function dateForm(time) {
    var data = new Date(time);
    var year = data.getFullYear();  //获取年
    var month = data.getMonth() + 1;    //获取月
    var day = data.getDate(); //获取日
    time = year + "-" + appendzero(month) + "-" + appendzero(day);
    return time;
}

8.计算6个月前的时间

function lessSixMonth(time) {
    var startDate = new Date(time);
    var firstdate = new Date(startDate.setMonth(startDate.getMonth()-6));
    return firstdate;
}

var firstdate = new Date(year, month, 1); //取指定月的第一天
var endDate = (new Date(firstdate.getTime() - 1000 * 60 * 60 * 24));//获取指定月最后一天

9.悬浮

//有iframe用window.parent.document,没有用document
 $(window.parent.document).scroll(function () {
        var scrollheight = parseInt($(window.parent.document).scrollTop());
        if (scrollheight >= 660) {
            $("#chartTab").css({
                "position": "fixed",
                "top": parseInt($(window.parent.document).scrollTop()) - 145 + "px"
            });
        } else if (scrollheight < 660) {
            $("#chartTab").css({
                "position": "relative",
                "top": "0px"
            });
        }
    });

10.在IE8不支持background-size,解决办法用过滤

.f-content{
    margin-top:40px;
    height: 480px;
    font-size: 16px;
    text-align: center;
    background-image: url('D:/BF/Desktop/DFI COC/images/funnel.png');
    background-size: cover;
    -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='D:/BF/Desktop/DFI COC/images/funnel.png',sizingMethod='scale')";
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='D:/BF/Desktop/DFI COC/images/funnel.png',
    sizingMethod='scale');
}
 <!--[if IE 8]>
    <style type="text/css">
    .f-content{
    margin-top:40px;
    height: 480px;
    font-size: 16px;
    text-align: center;
    background-image: none;
    background-size: cover;
    -ms-filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(src='D:/BF/Desktop/DFI COC/images/funnel.png',sizingMethod='scale')";
    filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
    src='D:/BF/Desktop/DFI COC/images/funnel.png',
    sizingMethod='scale');
}
</style>
<![endif]-->

网上说图片最好用绝对路径,貌似用相对路径也行呵!

暂时记下这几点。。。。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,324评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,303评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,192评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,555评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,569评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,566评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,927评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,583评论 0 257
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,827评论 1 297
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,590评论 2 320
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,669评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,365评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,941评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,928评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,159评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,880评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,399评论 2 342

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,580评论 18 139
  • <a name='html'>HTML</a> Doctype作用?标准模式与兼容模式各有什么区别? (1)、<...
    clark124阅读 3,455评论 1 19
  • 到了晚上 momo:我回来了! 多贤:你回来咯今天的派对好玩吗? momo:好玩啊!最重要的是食物有我最爱的猪蹄诶...
    万斯once阅读 219评论 0 0
  • 白斩鸡是很传统的一道美食,在中国北方非常的常见,制作好的白斩鸡皮黄肉白,味道非常的鲜美,那么大家知道白斩鸡的做法吗...
    快乐使者_阅读 3,241评论 0 0
  • 气质,截取百度百科:气质在社会所表现的,是一个人从内到外的一种内在的人格魅力然后所发挥的一个人内在魅力的质量的升华...
    硕铭阅读 558评论 0 3