美文网首页
珍爱网笔试总结

珍爱网笔试总结

作者: Gopal | 来源:发表于2018-07-23 22:28 被阅读230次

load和DOMContentLoad的区别

浏览器渲染页面DOM文档加载的步骤:
1.解析HTML结构。
2.加载外部脚本和css文件。
3.解析并执行脚本代码。
4.DOM树构建完成。(此时会触发DOMContentLoaded事件)
5.加载外部图片等文件。
6.页面加载完毕。(此时会触发load事件)
从以上DOM文档加载步骤上可以看出;当浏览器把DOM树构建完成后就开始触发了DOMContentLoaded事件,而load事件则要等包括图片这些加载完毕才会触发。
我们监听事件的时候把优先级高的可以先监听DOMContentLoaded再监听load。

实例:

  window.addEventListener("load", function () {   //添加load事件
       console.log("load执行");
   }, false);

   window.addEventListener("DOMContentLoaded", function () {  //添加DOMContentLoaded事件
       console.log("domContentLoad执行");
   }, false)

jQuery有三种方式针对文档的加载方法

$(document).ready(function() {
    // 跟DOMContentLoaded事件相似
})

//document ready 简写
$(function() {
    // .....
})

$(document).load(function() {
    //跟load事件相似
})

总结:DOMContentLoaded比load更符合用户体验,因为load还要等其他外部资源(图片之类的)加载完才能执行,而这些资源并不会影响到dom结构,所以我们大部分情况下都可以在dom加载第四步就执行我们的JavaScrip代码,也就是使用DOMContentLoaded。

js去除字符串前后空格

自己的思路:
通过将字符串转换成数组,然后获得第一个不是空格的字符串的位置和最后一个不是字符串的位置,然后使用字符串的slice方法即可。

function  clear(str) {
    var strArr = [].slice.call(str);
    var start,
            end;
    for (var i = 0; i < strArr.length; i++) {
        if (strArr[i] != ' ') {
            start = i;
            break;
        }
    }

    for (var j = strArr.length; j>=0; j--) {
        if (strArr[j] != ' ') {
            end = j;
            break;
        }
    }
    console.log(str.slice(start, end));
}

clear('   fsg   asdfa   ');

其实用正则表达式的话是非常简单的

function trimBr (str) {
      return str.replace(/(^\s*)|(\s*$)/g,  '');
}

如果是jQuery的话,直接使用trim方法即可

$.trim(str)

jquery原生实现

function trim(str){  
  return str.replace(/^(\s|\u00A0)+/,'').replace(/(\s|\u00A0)+$/,'');  
}

http://www.jb51.net/article/87107.htm

同源策略

同源策略在web应用的安全模型中是一个重要概念。在这个策略下,web浏览器允许第一个页面的脚本访问第二个页面里的数据,但是也只有在两个页面有相同的源时。源是由URI,主机名,端口号组合而成的。这个策略可以阻止一个页面上的恶意脚本通过页面的DOM对象获得访问另一个页面上敏感信息的权限。

https://www.jianshu.com/p/beb059c43a8b

实现动态执行JavaScript脚本

document.write

动态创建

指定src

先请求数据,再创建
document.body.insertBefore(script, document.body.firstChild);

https://www.cnblogs.com/love540376/p/5200314.html

http://www.jb51.net/article/78432.htm

原生ajax的具体实现

https://www.cnblogs.com/cythia/p/6978323.html

XXS和CORS

XSS:跨站点脚本攻击

CORS:跨站点请求伪造

完整的http请求

https://www.cnblogs.com/engeng/articles/5959335.html

移动端页面bug定位有效解决方案

  • ios下fixed元素容易定位出错,软键盘弹出时,影响fixed元素定位

  • 设置meta

  • 使用rem单位

  • 使用媒体查询进行页面适配

  • 事件使用touch事件

相关文章

  • 珍爱网笔试总结

    load和DOMContentLoad的区别 浏览器渲染页面DOM文档加载的步骤:1.解析HTML结构。2.加载外...

  • 笔试总结

    1.按下按键事件 为document绑定keydown事件处理程序,然后判断传入的event的keyCode键盘码...

  • 2019 | 腾讯暑期实习【HR】笔试:题型分析&总结

    参考#2017笔试经# 1 腾讯暑期实习【产品/HR岗位】笔试—— 题型分析&总结https://www.jian...

  • 笔试题总结

    32位机器上,以下结构的sizeof(P)为 /*考察结构体对齐和填充: 结构体每个成员相对于结构体首地址的偏移量...

  • 笔试总结(一)

    1.==运算符比较喜欢Number类型 Number([]) //0Number({}) //NaNNum...

  • 笔试总结(腾讯)

    前几日做的鹅厂的笔试,很蓝瘦,发现自己不会的很多,明天比完赛就要恶补了,大家一起来吧 1.TCP简历连接 2.UD...

  • 搜狗笔试总结

    看不懂答案。。。尴尬 求方差和最小的idx。方法就是D(x) = E(X^2) - E(X)2,利用前缀和数组,可...

  • 笔试面试总结

    找工作告一段路,总结一下这段时间遇到的一些印象中的笔试和面试题目。 公司一 写一个循环,步数10步,依次输出1,3...

  • Deecamp笔试总结

    第一部分:选择题(50分) 1、10分 在一个0/1 分类任务中:我们训练了一个神经网络,对于每个样本点,其输出为...

  • 华为2018届校招技术岗笔试题及个人解答

    前言 昨天(9.13)参加了华为2018届的技术岗笔试,特此总结一下笔试的题目和我个人的解答思路。笔试题一共是三道...

网友评论

      本文标题:珍爱网笔试总结

      本文链接:https://www.haomeiwen.com/subject/tqzxcftx.html