两年经验前端带你重学前端框架必会的ajax+node.js+webpack+git等技术 Day1_业界新闻

发布时间:2024-07-29 15:38

阅读量:0

黑马程序员前端AJAX入门到实战全套教程，包含学前端框架必会的（ajax+node.js+webpack+git），一套全覆盖 Day1

你好,我是Qiuner. 为帮助别人少走弯路和记录自己编程学习过程而写博客
这是我的 github https://github.com/Qiuner ⭐️
gitee https://gitee.com/Qiuner 🌹
如果本篇文章帮到了你不妨点个赞吧~ 我会很高兴的 😄 (^ ~ ^)
想看更多那就点个关注吧我会尽力带来有趣的内容 😎
本人已经做过多个前后端项目，这些技术也早就学过了，此次重学，一为服务其他人，让别人少走弯路。二为查缺补漏
本文档是黑马程序员公开学习视频的学习笔记，记录了bug、作业等。
官方笔记、资源在 https://pan.baidu.com/s/1Gd-ANtinWR7kh8TPTto10A&pwd=9987
官方接口文档在欢迎使用 - B站-AJAX和黑马头条-数据管理平台 (apifox.com)
在这篇文档中，我总结了一些思路与如做到与视频同步的办法
封面背景颜色是淡茜红

大致课程安排

AJAX

达到视频中效果课使用的插件

安装插件

 Preview on Web Server

使用插件

注意视频中其实是开了一个浏览器，然后实现一半一半屏幕

然后通过open in browser来

快速入门小案例

<!DOCTYPE html> <html lang="en"> <head>   <meta charset="UTF-8">   <meta name="viewport" content="width=device-width, initial-scale=1.0">   <title>axios基本使用</title> </head> <body>   <p class="my-p"></p> </body> <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> <script>   axios({     url:'http://hmajax.itheima.net/api/province'   }).then(result => {     console.log(result)     console.log(result.data.list)     document.querySelector('.my-p').innerHTML = result.data.list.join('<br>') }) </script> </html>

URL介绍

对资源

axios为什么这么写介绍

使用.then的方式来进行处理返回结果，result就是请求成功后服务器返回的东西

axios参数

axios查询参数

<!DOCTYPE html> <html lang="en"> <head>   <meta charset="UTF-8">   <meta name="viewport" content="width=device-width, initial-scale=1.0">   <title>axios基本使用</title> </head> <body>   <p class="my-p"></p> </body> <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> <script> axios({   url:'http://hmajax.itheima.net/api/city',   params:{     pname:'福建省'   } }).then(result =>{   console.log(result.data.list)   document.querySelector('p').innerHTML = result.data.list.join('<br>') }) </script> </html>