十道前端面试题(5)

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接: https://blog.csdn.net/weixin_43572937/article/details/102700749
  1. 行内元素和块级元素有哪些,img属于什么元素
  2. 写一下DOM节点的增删改
  3. 讲讲304
  4. 如何让一个元素消失
  5. 事件监听
  6. 数组常用的方法有哪些
  7. 遍历数组处理用for循环还有什么方法吗
  8. 给你一个乱序数组,你怎么样排序
  9. 介绍一下盒子模型
  10. 讲讲JS的语言特性

1.行内元素和块级元素有哪些,img属于什么元素

行内元素又叫内联元素,有:

  1. <a>标签可定义锚
  2. <abbr>表示一个缩写形式
  3. <acronym>定义只取首字母缩写
  4. <b>字体加粗
  5. <bdo>可覆盖默认的文本方向
  6. <big>大号字体加粗
  7. <br>换行
  8. <cite>引用进行定义
  9. <code>定义计算机代码文本
  10. <dfn>定义一个定义项目
  11. <em>定义为强调的内容
  12. <i>斜体文本效果
  13. <img>向网页中嵌入一幅图像
  14. <input>输入框
  15. <kbd>定义键盘文本
  16. <label>标签 为<input>元素定义标注(标记)
  17. <q>定义短的引用
  18. <samp>定义样本文本
  19. <select>创建单选或多选菜单
  20. <small>呈现小号字体效果
  21. <span>组合文档中的行内元素
  22. <strong>语气更强的强调的内容
  23. <sub>定义下标文本
  24. <sup>定义上标文本
  25. <textarea>多行的文本输入控件
  26. <tt>打字机或者等宽的文本效果
  27. <var>定义变量

块级元素有:

  1. <address>定义地址
  2. <caption>定义表格标题
  3. <dd>定义列表中定义条目
  4. <div>定义文档中的分区或节
  5. <dl>定义列表
  6. <dt>定义列表中的项目
  7. <fieldset>定义一个框架集
  8. <form>创建 HTML表单
  9. <h1>定义最大的标题
  10. <h2>定义副标题
  11. <h3>定义标题
  12. <h4>定义标题
  13. <h5>定义标题
  14. <h6>定义最小的标题
  15. <hr>创建一条水平线
  16. <legend>元素为<fieldset>元素定义标题
  17. <li>标签定义列表项目
  18. <noframes>为那些不支持框架的浏览器显示文本,于 frameset元素内部
  19. <noscript>定义在脚本未被执行时的替代内容
  20. <ol>定义有序列表
  21. <ul>定义无序列表
  22. <p>标签定义段落
  23. <pre>定义预格式化的文本
  24. <table>标签定义HTML表格
  25. <tbody>标签表格主体(正文)
  26. <td>表格中的标准单元格
  27. <tfoot>定义表格的页脚(脚注或表注)
  28. <th>定义表头单元格
  29. <thead>标签定义表格的表头
  30. <tr>定义表格中的行

点击查看行内元素和块级元素区别


2. 写一下DOM节点的增删改

  1. 查找
    DOM1:getElementById(),getElementsByTagName()
    DOM扩展:querySelector()(返回第一个匹配的元素),querySelectorAll()(返回全部匹配的元素)
    HTML5:getElementsByClassName()
  2. 插入
    appendChild():末尾插入
    insertBefore():特定位置插入
  3. 替换
    replaceChild():接受两个参数,第一个为要插入的节点,第二个为要替换的节点
  4. 删除
    removeChild()
  5. 创建
    createElement()

3. 讲讲304

304状态码是告诉浏览器可以从缓存中获取所请求的资源。

当浏览器请求某一文件时,发现自己缓存的文件有Last-Modified,就会在httpRequest里面添加消息头If-Modified-Since和If-Non-Match,服务器在收到reqeust时,和服务器本地文件对比,如果没有更新,则仅仅返回一个响应头Head(状态码304,而没有响应体),客户端在收到这个响应时,就会从本地缓存加载请求的资源。

点击了解更多HTTP状态码


4. 如何让一个元素消失

隐藏元素的几种方法:

  1. 该元素样式设置:display:none;
  2. 该元素样式设置:visibility:hidden;
  3. 该元素样式设置高宽为0
  4. 隐藏其祖先元素
  5. 该元素样式设置:opacity:0;

5. 事件监听

  1. 传统事件绑定
  • 在事件名称前加on如:onclickonload
  • 兼容性好
  • 同一个元素绑定多个事件时只有最后一个会被触发
  1. addEventListener()
  • 语法element.addEventListener(type, function, useCapture)第三个参数指定事件是否在捕获阶段执行,默认false(冒泡阶段执行),true(捕获阶段执行)
  • 可以给同一个元素绑定多个事件,且不会覆盖。先绑定的事件先执行
  • IE低版本不兼容
  • removeEventListener()方法移除绑定事件
  1. attachEvent()
  • 语法:element.attachEvent('on+type',function)
  • IE的方法,不遵循W3C标准
  • 后绑定,先执行

6. 数组常用的方法有哪些(点击查看)


7. 遍历数组处理用for循环还有什么方法吗

遍历数组的方法:

  1. for循环
  2. for...of循环
  3. forEach()
  4. map()
  5. filter()
  6. every()
  7. some()
  8. reduce()
  9. reduceRight()
  10. find()
  11. findIndex()
  12. keys()values()entries()

点击查看更多数组方法


8. 给你一个乱序数组,你怎么样排序

排序的方法:

  1. 冒泡排序
  2. 选择排序
  3. 快速排序
  4. 插入排序
  5. 归并排序
  6. 希尔排序
  7. 堆排序

数组排序:除了上诉算法排序还可以使用sort()方法

点击查看常见排序算法实现


9. 介绍一下盒子模型(点击查看)


10. 讲讲JS的语言特性

  1. 脚本语言。JavaScript是一种解释型的脚本语言,C、C++等语言先编译后执行,而JavaScript是在程序的运行过程中逐行进行解释。
  2. 基于对象。JavaScript是一种基于对象的脚本语言,它不仅可以创建对象,也能使用现有的对象。
  3. 简单。JavaScript语言中采用的是弱类型的变量类型,对使用的数据类型未做出严格的要求,是基于Java基本语句和控制的脚本语言,其设计简单紧凑。
  4. 动态性。JavaScript是一种采用事件驱动的脚本语言,它不需要经过Web服务器就可以对用户的输入做出响应。在访问一个网页时,鼠标在网页中进行鼠标点击或上下移、窗口移动等操作JavaScript都可直接对这些事件给出相应的响应。
  5. 跨平台性。JavaScript脚本语言不依赖于操作系统,仅需要浏览器的支持。因此一个JavaScript脚本在编写后可以带到任意机器上使用,前提上机器上的浏览器支 持JavaScript脚本语言,目前JavaScript已被大多数的浏览器所支持。

猜你喜欢

转载自blog.csdn.net/weixin_43572937/article/details/102700749