2024年前端最新免费开放的API接口 供学习使用，前端面试必备的集合源码详解

学习笔记

主要内容包括html，css，html5，css3，JavaScript，正则表达式，函数，BOM，DOM，jQuery，AJAX，vue等等

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

HTML/CSS

**HTML：**HTML基本结构，标签属性，事件属性，文本标签，多媒体标签，列表 / 表格 / 表单标签，其他语义化标签，网页结构，模块划分

**CSS：**CSS代码语法，CSS 放置位置，CSS的继承，选择器的种类/优先级，背景样式，字体样式，文本属性，基本样式，样式重置，盒模型样式，浮动float，定位position，浏览器默认样式

HTML5 /CSS3

**HTML5：**HTML5 的优势，HTML5 废弃元素，HTML5 新增元素，HTML5 表单相关元素和属性

**CSS3：**CSS3 新增选择器，CSS3 新增属性，新增变形动画属性，3D变形属性，CSS3 的过渡属性，CSS3 的动画属性，CSS3 新增多列属性，CSS3新增单位，弹性盒模型

JavaScript

**JavaScript：**JavaScript基础，JavaScript数据类型，算术运算，强制转换，赋值运算，关系运算，逻辑运算，三元运算，分支循环，switch，while，do-while，for，break，continue，数组，数组方法，二维数组，字符串

1. https://www.apiopen.top/meituApi?page=1

2. https://www.easy-mock.com/mock/5c36b5d2be0a1c39bfd57589/img/beauty/page=1

风景图片：

1. https://www.easy-mock.com/mock/5c36b5d2be0a1c39bfd57589/img/page=1

第一个接口每页有20条数据，多少页还不清楚，返回数据如图

后两个接口是我用Easy Mock写的，第一个接口一共3页，每一页有10条数据，page表示页码。第二个接口两页，每一页10条数据。返回数据如下图

音乐类接口

---

1. 音乐搜索：https://api.apiopen.top/searchMusic?name=好久不见

返回数据如图

1. 音乐详情：https://api.apiopen.top/musicDetails?id=604392760

返回数据如图

1. 音乐排行榜：https://api.apiopen.top/musicRankings

该接口包含有热歌榜，新歌榜，网络歌曲榜，影视金曲榜，经典老歌榜以及欧美金曲榜。每个榜有4条数据，下面拿热歌榜数据如图

1. 音乐排行榜详情：https://api.apiopen.top/musicRankingsDetails?type=1

返回数据如图

1. 音乐电台：https://api.apiopen.top/musicBroadcasting

此接口有公共频道和音乐人频道，返回数据如图

1. 音乐电台详情：https://api.apiopen.top/musicBroadcastingDetails?channelname=public_tuijian_spring

返回数据如图

视频类接口

---

1. 视频分类：https://api.apiopen.top/videoHomeTab

共有22种分类，每一类又有详细的视频，返回数据如图

1. 视频分类：https://api.apiopen.top/videoCategory

和上面的类似，返回数据如图

1. 今日视频推荐：https://api.apiopen.top/todayVideo

返回数据如图

1. 根据ID推荐视频：https://api.apiopen.top/videoRecommend?id=127398

返回数据如图

小说类接口

---

1. 书籍分类：https://www.easy-mock.com/mock/5c3e90f39d8f6075a543c3cd/story/classify

用easymock写的，只有分类，包括类型和图片，共16中分类，返回数据如图

1. 小说搜索：https://www.apiopen.top/novelSearchApi?name=盗墓笔记

该接口提供的搜索功能只限小说名称，返回数据如图

1. 小说详情：https://www.apiopen.top/novelInfoApi?name=盗墓笔记

返回数据如图

天气类接口

---

1. 搜索地方天气：https://www.apiopen.top/weatherApi?city=成都

返回数据如图

段子类接口

---

1. 最新段子：https://api.apiopen.top/getJoke?page=1&count=2&type=video

返回数据如图

1. 通过ID查段子：https://api.apiopen.top/getSingleJoke?sid=28654780

返回数据如图

最后

小编综合了阿里的面试题做了一份前端面试题PDF文档，里面有面试题的详细解析

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

虽只说了一个公司的面试，但我们可以知道大厂关注的东西并举一反三，通过一个知识点延伸到另一个知识点，这是我们要掌握的学习方法，小伙伴们在这篇有学到的请评论点赞转发告诉小编哦，谢谢大家的支持！

e/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0tlcGxlcl9JSQ==,size_16,color_FFFFFF,t_70)

虽只说了一个公司的面试，但我们可以知道大厂关注的东西并举一反三，通过一个知识点延伸到另一个知识点，这是我们要掌握的学习方法，小伙伴们在这篇有学到的请评论点赞转发告诉小编哦，谢谢大家的支持！