2024年web前端网页设计作业—个人网页(游戏主题)(html+css,2024年最新前端最新实习面试经验总结

JavaScript

  • js的基本类型有哪些?引用类型有哪些?null和undefined的区别。

  • 如何判断一个变量是Array类型?如何判断一个变量是Number类型?(都不止一种)

  • Object是引用类型嘛?引用类型和基本类型有什么区别?哪个是存在堆哪一个是存在栈上面的?

  • JS常见的dom操作api

  • 解释一下事件冒泡和事件捕获

  • 事件委托(手写例子),事件冒泡和捕获,如何阻止冒泡?如何组织默认事件?

  • 对闭包的理解?什么时候构成闭包?闭包的实现方法?闭包的优缺点?

  • this有哪些使用场景?跟C,Java中的this有什么区别?如何改变this的值?

  • call,apply,bind

  • 显示原型和隐式原型,手绘原型链,原型链是什么?为什么要有原型链

  • 创建对象的多种方式

  • 实现继承的多种方式和优缺点

  • new 一个对象具体做了什么

  • 手写Ajax,XMLHttpRequest

  • 变量提升

  • 举例说明一个匿名函数的典型用例

  • 指出JS的宿主对象和原生对象的区别,为什么扩展JS内置对象不是好的做法?有哪些内置对象和内置函数?

  • attribute和property的区别

  • document load和document DOMContentLoaded两个事件的区别

  • JS代码调试

  • 开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

                      <a href="#">
                          <p></p>
                          <span>分享</span>
                      </a>
                  </div>
                  <div>
                      <a href="#">
                          <p></p>
                          <span>更多</span>
                      </a>
                  </div>
              </div>
              <div class="main\_right">
                  <div class="content hidden" style="display: block">
                      <img src="img/logo.png" alt="" / class="touxiang">
                      <p>我们将为您带来最新的游戏资讯</p>
                  </div>
    
                  <div class="content hidden">
                      <img src="img/04.png" alt="" / class="touxiang">
                      <p>总览各大品台最新的游戏消息</p>
                      <p>没有那个人,我就做那个人——中岛美嘉</p>
                  </div>
    
                  <div class="content hidden">
                      <img src="img/01.jpg" alt="" / class="touxiang">
                      <p>生命是有关光的,在我熄灭以前</p>
                      <p>能够照亮你一点,就是我所有能做的的了</p>
                      <p></p>
                  </div>
    
                  <div class="content hidden">
                      <img src="img/R-C.png" alt="" / class="touxiang">
                      <p>旅途开始</p>
                      <p></p>
                      <p></p>
                  </div>
    
                  <div class="content hidden">
                      <img src="img/05.png" alt="" / class="touxiang">
                      <p></p>
                      <p></p>
                      <p>战斗不止</p>
                  </div>
    
                  <div class="content hidden">
                      <img src="img/csgo05.webp" alt="" / class="touxiang">
                      <p></p>
                      <p></p>
                      <p>望远处是风景,看近处才是人生!</p>
                  </div>
    
                  <div class="content hidden">
                      <img src="img/03.jpg" alt="" / class="touxiang">
                      <p>你要咽的下这世间的不美好</p>
                      <p>才配得上这世上一切的美好</p>
                  </div>
              </div>
          </main>
      </div>
      <!-- <h3>第二屏</h3> -->
      <div class="section sec2" id="section2">
          <!-- 背景小圆点 -->
          <div class="sec1\_circle1"></div>
          <div class="sec1\_circle2"></div>
          <div class="sec2\_circle1"></div>
          <div class="sec2\_circle2"></div>
          <div class="sec2\_circle3"></div>
              <!-- 主题内容 -->
              <div class="sec2\_main">
                  <div class="sec2\_main\_head">
                      <ul>
                          <li class="current1">
                              <a href="#">FPS主题</a>
                          </li>
                          <li><a href="#">MOBA主题</a></li>
                          <li><a href="#">冒险主题</a></li>
                          <li><a href="#">像素主题</a></li>
                          <li><a href="#">休闲主题</a></li>
                          <li><a href="#">生存主题</a></li>
                      </ul>
                  </div>
                  <div class="sec2\_main\_body">
                      <div class="sec2\_main\_body\_content hidden" style="display: block">
                          <div class="sec2\_main\_body\_content\_left">
                              <p>彩虹六号:围攻联机版</p>
                              <p>求生之路2/生存之旅2</p>
                              <p>孤岛危机:重制版</p>
                              <p>狙击手:幽灵战士契约</p>
                              <p>孤岛惊魂5</p>
                              <p>英雄萨姆4</p>
                              <p>泰坦陨落</p>
                              <p>合金弹头XX 官方正式版</p>
                              <p>光环:士官长合集</p>
                          </div>
                          <div class="sec2\_main\_body\_content\_right">
                              <img src="img/2-1.jpg" alt="" />
                          </div>
                      </div>
                      <div class="sec2\_main\_body\_content hidden">
                          <div class="sec2\_main\_body\_content\_left">
                              <p>英雄联盟</p>
                              <p>DOTA2</p>
                              <p>梦三国</p>
                              <p>风暴英雄</p>
                              <p>英魂之刃</p>
                              <p>300英雄</p>
                              <p>王者荣耀</p>
                          </div>
                          <div class="sec2\_main\_body\_content\_right">
                              <img src="img/1000.webp" alt="" />
                          </div>
                      </div>
                      <div class="sec2\_main\_body\_content hidden">
                          <div class="sec2\_main\_body\_content\_left">
                              <p>古墓丽影:崛起</p>
                              <p>异星探险家</p>
                              <p>艾迪芬奇的记忆</p>
                              <p>传送门骑士</p>
                              <p>饥荒</p>
                              <p>美丽水世界</p>
                              <p>Firewatch</p>
                              <p>奥日与黑暗森林</p>
                              <p>银河历险记3</p>
                          </div>
                          <div class="sec2\_main\_body\_content\_right">
                              <img src="img/2-3.jpg" alt="" />
                          </div>
                      </div>
                      <div class="sec2\_main\_body\_content hidden">
                          <div class="sec2\_main\_body\_content\_left">
                              <p>泰拉瑞亚 Terraria</p>
                              <p>星界边境 Starbound</p>
                              <p>星露山谷 Stardew valley</p>
                              <p>以撒的结合:重生</p>
                              <p>雨中冒险 Risk of rain</p>
                              <p>Crypt of necrodancer</p>
                              <P>尼德霍格 Nidhogg </P>
                      
                          </div>
                          <div class="sec2\_main\_body\_content\_right">
                              <img src="img/2-4.jpg" alt="" />
                          </div>
                      </div>
                      <div class="sec2\_main\_body\_content hidden">
                          <div class="sec2\_main\_body\_content\_left">
                              <p>太空狼人杀 Among Us</p>
                              <p>大富翁10</p>
                              <p>胡闹厨房2 Overcooked! </p>
                              <p>桥梁建筑师 Poly Bridge</p>
                              <p>植物大战僵尸 Plants Vs. Zombies </p>
                          </div>
                          <div class="sec2\_main\_body\_content\_right">
                              <img src="img/2-7.jpg" alt="" />
                          </div>
                      </div>
                      <div class="sec2\_main\_body\_content hidden">
                          <div class="sec2\_main\_body\_content\_left">
                              <p>方舟:生存进化</p>
                              <p>我的世界:地下城</p>
                              <p>森林</p>
                              <p>荒岛求生</p>
                              <P>DayZ </P>
                              <P>RimWorld 环世界</P>
                              <P>Outlast </P>
                              <a href="#"><p>这是我的战争</p></a>
                          </div>
                          <div class="sec2\_main\_body\_content\_right">
                              <img src="img/2-6.jpg" alt="" />
                          </div>
                      </div>
                  </div>
              </div>
          </div>
          <!-- <h3>第三屏</h3> -->
          <div class="section sec3" id="section3">
              <div class="slide">
                  <img src="img/3-1.jpg" alt="" />
              </div>
              <div class="slide">
                  <img src="img/3-2.jpg" alt="" />
              </div>
              <div class="slide">
                  <img src="img/-3-3.jpg" alt="" />
              </div>
              <div class="slide">
                  <img src="img/3-4.jpg" alt="" />
              </div>
              <div class="slide">
                  <img src="img/3-5.jpg" alt="" />
              </div>
              <div>
                  <img src="img/3-6.jpg" alt=""/>
              </div>
          
          </div>
          <!-- <h3>第四屏</h3> -->
          <div class="section sec4" id="section4">
              <!-- 背景小圆点 -->
              <div class="sec4\_circle1"></div>
              <div class="sec4\_circle2"></div>
              <div class="sec4\_circle3"></div>
              <!-- 主题内容 -->
              <div class="sec4\_main\_box">
                  <!-- 天气板块 -->
                  <div id="sec4-app">
                      <div class="sec4\_title"><h3 style="color:blueviolet">游戏资讯</h3></div>
                      <a href="https://www.ali213.net/news/html/2022-4/671803.html"><h2 style="text-align:center; color: cornflowerblue;">      暴雪魔兽手游即将来临!爆料称其中一个像宝可梦GO        2022-04-28 </h2></a>
                      <a href="https://www.ea.com/games/apex-legends/news?isLocalized=true"><h2 style="text-align:center; color: cornflowerblue;">      Apex 英雄最新消息         2022-04-27</h2></a>
                      <a href="https://www.ali213.net/news/html/2022-4/671781.html"><h2 style="text-align:center;color: cornflowerblue;">      《消逝的光芒2》修复合作模式bug 新游戏+模式上线!      2022-04-28</h2></a>
                      <a href="https://store.steampowered.com/"><h2 style="text-align:center;color: cornflowerblue;">      多人FPS游戏《守望先锋2》战网分流下载发布!        2022-04-28</h2></a>
                      <a href="https://cf.qq.com/cp/a20220401newrole/pc/index.html?e\_code=507909"><h2 style="text-align:center;color: cornflowerblue;">        CF 5.1神枪节 全新限定来即领         2022-04-28</h2></a>
                      <a href="https://lol.qq.com/act/a20220429preedgskins/index.html?e\_code=507042"><h2 style="text-align:center;color: cornflowerblue;">     EDG冠军皮肤:银龙铸铠之日,骑士归来之时       2022-04-28</h2></a>
                      <a href="https://www.ali213.net/news/html/2022-4/671675.html"><h2 style="text-align:center;color: cornflowerblue;">      《王者荣耀》关羽马没了!荣耀典藏皮肤开摩托撞人        2022-04-28</h2></a>
                      <a href="https://www.ali213.net/news/html/2022-4/671507.html"><h2 style="text-align:center;color: cornflowerblue;">      万代Steam黄金周特卖活动:多款游戏新平史低促销!       2022-04-27</h2></a>
                      <a href="https://hy.163.com/2019/hifive/"><h2 style="text-align:center;color: cornflowerblue;">      荒野行动狂欢月,免费金品,万元现金        2022-04-29</h2></a>
                      <a href="https://baijiahao.baidu.com/s?id=1736426198846265653&wfr=spider&for=pc"><h2 style="text-align:center;color: cornflowerblue;">      《我的世界》限时特惠礼包惊喜上线,多重福利等你解锁!        2022-06-29</h2></a>
                      <div class="sec4\_search">
                          <input
    

type=“text”
name=“”
id=“”
placeholder=“搜索”
@keyup.enter=“searchEnter”
v-model=“city”
class=“sec4_input”
/>
<button @click=“clickButton” class=“sec4_button”>搜索


<a href=“javascript:;” @click=“changeCity(‘南昌’)”>
<a href=“javascript:;” @click=“changeCity(‘杭州’)”>
<a href=“javascript:;” @click=“changeCity(‘上海’)”>
<a href=“javascript:;” @click=“changeCity(‘北京’)”>
<a href=“javascript:;” @click=“changeCity(‘广州’)”>




  • {{item.type}}

    {{item.low}}

    {{item.date}}












<!-- ------------------------------------------------- -->


js基础

1)对js的理解?
2)请说出以下代码输出的值?
3)把以下代码,改写成依次输出0-9
4)如何区分数组对象,普通对象,函数对象
5)面向对象、面向过程
6)面向对象的三大基本特性
7)XML和JSON的区别?
8)Web Worker 和webSocket?
9)Javascript垃圾回收方法?
10)new操作符具体干了什么呢?
11)js延迟加载的方式有哪些?
12)WEB应用从服务器主动推送Data到客户端有那些方式?

js基础.PNG

前16.PNG

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

L和JSON的区别?
8)Web Worker 和webSocket?
9)Javascript垃圾回收方法?
10)new操作符具体干了什么呢?
11)js延迟加载的方式有哪些?
12)WEB应用从服务器主动推送Data到客户端有那些方式?

[外链图片转存中…(img-yOswR3ZS-1715471922674)]

[外链图片转存中…(img-a9gtCuve-1715471922675)]

开源分享:【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

  • 14
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值