董洞洞同学

web前端开发基础入门html5+css3+js学习笔记（一）

1.第一个前端程序
2.前端工具的选择与安装
3.VSCode开发者工具快捷键
4.HTML5简介与基础骨架
- - 4.1 HTML5的DOCTYPE声明
  - 4.2 HTML5基本骨架
  - - 4.2.1 html标签
    - 4.2.2 head标签
    - 4.2.3 body标签
    - 4.2.4 title标签
    - 4.2.5 meta标签
5.标签之标题
- 5.1 快捷键
- 5.1 标题标签位置摆放
6.标签之段落、换行、水平线
- 6.1 标签之段落
- 6.2换行
- 6.3 水平线
7.标签之图片
8.图片路径详解
- 8.1 绝对路径
- 8.2 相对路径
- - 8.2.1 子级`/`
  - 8.2.2 父级`../`
  - 8.2.3 同级`./`
- 8.3 网络路径
9.标签之超文本链接
- 9.1 超链接描述
- 9.2 超链接属性
- 9.3 超链接表现
10.标签之文本
- 10.1 常用文本标签
11. 列表标签之有序列表
- 11.1 有序列表
- 11.2 type属性
- 11.3 有序列表嵌套
12.列表标签之无序列表
- 12.1 无序列表实现
- 12.2 type属性
- 12.3 无序列表嵌套
- 12.4 常见应用场景
- 12.5 快捷键
13.标签之表格
- 13.1 表格展示效果
- 13.2 快捷键
- 13.3 表格属性
14.表格单元格合并
15.Form表单
- 15.1 表单元素（可理解为表单控件）
16.表单元素
- 16.1 文本框
- 16.2 密码框
- 16.3 提交按钮
17.块元素与行内元素（内联元素）
18.HTML5新增标签
- 18.1 拓展知识
- 18.2 H5新标签

1.第一个前端程序

用记事本创建文件名为Welcome.html

<html>
	<head>
			<title>
			我的第一个网页
			title>
	head>
	<body>
	欢迎来到网页制作
	body>
html>

2.前端工具的选择与安装

浏览器选择：谷歌浏览器（有开发者调试工具）
鼠标右键，选择检查，进入开发者调试工具

开发者工具：VSCode
安装中文，扩展，收索chinese，安装

3.VSCode开发者工具快捷键

生成浏览器文件.html的快捷方式

! + 回车（注意是英文的叹号）

VSCode常用快捷键列表

1.代码格式化：shift + alt + f
2.向上或向下移动一行：alt+up或alt+down
3.快速复制一行代码：shift+alt+up或shift+alt+down
4.快速保存：ctrl+s
5.快速查找：ctrl+f
6.快速替换：ctrl+h

4.HTML5简介与基础骨架

4.1 HTML5的DOCTYPE声明

避免浏览器怪异模式，防止不同浏览器渲染出不同效果来。

1. DOCTYPE html>

4.2 HTML5基本骨架

4.2.1 html标签

其他元素要包裹在它里面，限定了文档的开始点和结束点

1. DOCTYPE html>
2. <html>
3. html>

4.2.2 head标签

head标签用于定义文档的头部，描述了文档的各种属性和信息，包括文档的标题、在Web中的文职以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

1. DOCTYPE html>
2. <html>
3. 		<head>
4. 		head>
5. <html>

4.2.3 body标签

body元素定义文档的主体。
body元素包含文档中的所有内容（比如文本、超链接、图像、表格和列表等等）
它会直接在页面中显示出来，也就是用户可以直观看到的内容

 1. DOCTYPE html>
 2. <html>
 3. 		<head>
 4. 		head>
 5. 		<body>
 6. 			我会显示在浏览器中
 7. 		body>
 8. html>

4.2.4 title标签

可定义文档的标题
它显示在浏览器窗口的标题栏或状态栏上
</code>标签是<code><head></code>标签中唯一必须要求包含的东西，就是说写head一定要写title</li> <li><code><title></code>的增加有利于SEO优化（收索引擎优化）</li> </ol> <pre><code class="prism language-html"><!DOCTYPE html> <html> <head> <title>我的网页</title> </head> <body> 欢迎光临 </body> </html> </code></pre> <h4>4.2.5 meta标签</h4> meta是一个单标签。meta标签用来描述一个HTML网页文档的属性，关键词等，例如：<code>charset="utf-8"</code>是说当前使用的是<code>utf-8</code>编码格式，在开发中我们经常会看到<code>utf-8</code>，或是<code>gbk</code>，这些都是编码格式，通常使用<code>utf-8</code> <pre><code class="prism language-html"><!DOCTYPE html> <html> <head> <title>我的网页</title> <meta charset="UTF-8"> </head> <body> 欢迎光临 </body> </html> </code></pre> <h1>5.标签之标题</h1> 总共有六级 <pre><code class="prism language-html"><h1>一级标题</h1> <h2>二级标题</h2> <h3>三级标题</h3> <h4>四级标题</h4> <h5>五级标题</h5> <h6>六级标题</h6> </code></pre> <h2>5.1 快捷键</h2> 生成<code>h1-h6</code>的快捷键<code>h$*6</code> 快速打开浏览器安装插件 拓展，搜索open in browser，点击安装 正确使用标签可以提高seo <h2>5.1 标题标签位置摆放</h2> 在标签中添加属性：<code>align=left|center|right</code> <h1>6.标签之段落、换行、水平线</h1> <h2>6.1 标签之段落</h2> 段落是通过<code></code>标签定义的 建议文本写在标签内，标签内可以修改其字体大小等，标签外无法控制 <h2>6.2换行</h2> <code> </code>或<code> </code>单标签 <h2>6.3 水平线</h2> <code><hr/></code>标签在html页面中创建水平线 属性：color,width,size,align <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <p> 我是一个段<br>落标签 </p> <hr color="red" width="300px" size="20px" align="left">  </body> </html> </code></pre> <h1>7.标签之图片</h1> 网站中最多的元素就是图片 <code><img></code>标签定义html页面中的图像，它是单标签 属性： <blockquote> 1 src:路径（图片地址与名字） 2 alt:规定图像的替代文本（当图片无法正常显示的时候，显示的文字） 3.width：图像的宽度 4. height：图像的高度 5. title：鼠标悬停在图片上给予提示 </blockquote> <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <img src="1.webp" alt="美丽的小姐姐" width="300px" title="小姐姐"> </body> </html> </code></pre> <h1>8.图片路径详解</h1> <h2>8.1 绝对路径</h2> 从盘符开始 <h2>8.2 相对路径</h2> <h3>8.2.1 子级<code>/</code></h3> <h3>8.2.2 父级<code>../</code></h3> <h3>8.2.3 同级<code>./</code></h3> <h2>8.3 网络路径</h2> 具体的网络地址 <h1>9.标签之超文本链接</h1> <h2>9.1 超链接描述</h2> html使用标签<code><a></code>来设置超文本链接 超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，点击这些内容来跳转到新的文档或者当前文档中的某个部分。 <h2>9.2 超链接属性</h2> 在标签<code><a></code>中使用了<code>href</code>属性来描述链接的地址 <code><a href="url">链接文本</a></code> 默认情况下，链接未点是蓝色带下划线，点击后是紫色带下划线，点击时红色带下划线。后期可用css样式修改这些效果 <h2>9.3 超链接表现</h2> 鼠标移动到超链接上会变成小手 <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <a href="https://www.baidu.com">百度一下</a> <a href="https://www.baidu.com"> <img src="1.webp" width="300px"> </a> </body> </html> </code></pre> <h1>10.标签之文本</h1> <h2>10.1 常用文本标签</h2> <table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><code></code></td> <td>定义着重文字</td> </tr> <tr> <td><code></code></td> <td>定义粗体文本</td> </tr> <tr> <td><code></code></td> <td>定义斜体字</td> </tr> <tr> <td><code></code></td> <td>定义家中语气</td> </tr> <tr> <td><code><del></code></td> <td>定义删除字</td> </tr> <tr> <td><code></code></td> <td>元素没有特定的含义（为了日后添加css样式方便）</td> </tr> </tbody> </table> <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <p>白菜</p> <p>我喜欢吃<em>em白菜</em></p> <i>i白菜</i> <b>b白菜</b> <strong>strong白菜</strong> <span>span白菜</span> <del>del白菜</del> </body> </html> </code></pre> <h1>11. 列表标签之有序列表</h1> <h2>11.1 有序列表</h2> 有序列表是一列项目，列表项目使用数字进行标记。有序列表始于<code><ol></code>标签。每个列表项始于<code><li></code>标签 <h2>11.2 type属性</h2> <code><ol></code>的属性type拥有的选项 <ol> <li>1 表示列表项目用数字标号（1，2，3…）</li> <li>a 表示列表项目用小写字母标号（a,b,c…）</li> <li>A 表示列表项目用大写字母标号（A，B，C…）</li> <li>i 表示列表项目用小写罗马数字标号（i，ii，iii…）</li> <li>I 表示列表项目用大写罗马数字标号（I, II, III…）</li> </ol> <h2>11.3 有序列表嵌套</h2> <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <ol type="a"> <li>苹果</li> <li>橘子</li> <li>香蕉</li> <li>火龙果</li> </ol> <ol type="A"> <li>苹果</li> <li>橘子</li> <li>香蕉</li> <li>火龙果</li> </ol> <ol type="1"> <li>苹果</li> <li>橘子</li> <li>香蕉</li> <li>火龙果</li> </ol> <ol type="i"> <li>苹果</li> <li>橘子</li> <li>香蕉</li> <li>火龙果</li> </ol> <ol type="I"> <li>苹果</li> <li>橘子</li> <li>香蕉</li> <li>火龙果</li> </ol> <ol> <li>水果</li> <li> 蔬菜 <ol> <li>白菜</li> <li>油菜</li> <li>辣椒</li> <li>黄瓜</li> </ol> </li> <li>肉类</li> </ol> </body> </html> </code></pre> <h1>12.列表标签之无序列表</h1> <h2>12.1 无序列表实现</h2> 无序列表是一个项目的列表，此列项目使用粗体原点（典型的小黑圆圈）进行标记 无序列表始于<code><ul></code>标签。每个列表项始于<code><li></code>标签。 <h2>12.2 type属性</h2> <code><ul></code>的属性type拥有的选项 <ul> <li>disc 默认实心圆</li> <li>circle 空心圆</li> <li>square 小方块</li> <li>none 不显示</li> </ul> <h2>12.3 无序列表嵌套</h2> <h2>12.4 常见应用场景</h2> <ul> <li>无序的列表效果</li> <li>导航效果</li> </ul> <h2>12.5 快捷键</h2> 快速生成ul+li的布局：<code>ul>li*3</code>(数字根据自己的需要的li数量修改) <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <ul type="disc"> <li>香蕉</li> <li>苹果</li> </ul> <ul type="circle"> <li>香蕉</li> <li>苹果</li> </ul> <ul type="square"> <li>香蕉</li> <li>苹果</li> </ul> <ul type="none"> <li>香蕉</li> <li>苹果</li> </ul> <ul> <li>蔬菜</li> <li> 水果 <ul> <li>苹果</li> <li>香蕉</li> <li>橘子</li> </ul> </li> <li>肉类</li> </ul> <ul> <li></li> <li></li> <li></li> <li></li> <li></li> </ul> </body> </html> </code></pre> <h1>13.标签之表格</h1> <h2>13.1 表格展示效果</h2> 表格：<code><table></code> 行：<code><tr></code> 单元格（列）：<code><td></code> <h2>13.2 快捷键</h2> 快速生成表格结构:<code>table>tr*4>td*5{单元格}</code> <h2>13.3 表格属性</h2> <ol> <li>border：设置表格的边框</li> <li>width：设置表格的宽度</li> <li>height：设置表格的高度</li> </ol> <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <table border="1" width="400px" height="200px"> <tr> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> <tr> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> <tr> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> </table> <table> <tr> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> <tr> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> <tr> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> <tr> <td>单元格</td> <td>单元格</td> <td>单元格</td> </tr> </table> </body> </html> </code></pre> <h1>14.表格单元格合并</h1> 单元格合并属性 <a href="http://img.e-com-net.com/image/info8/a726633809b744bc88c107da14d6041d.jpg" target="_blank"><img src="http://img.e-com-net.com/image/info8/a726633809b744bc88c107da14d6041d.jpg" alt="web前端开发基础入门html5+css3+js学习笔记（一）_第1张图片" width="281" height="113" style="border:1px solid black;"></a> <ul> <li>水平合并：colspan</li> <li>垂直合并: rowspan</li> </ul> <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <p>合并单元格6和7：colspan</p> <p>合并单元格15和20：rowspan</p> <p>水平合并：保留左边，删除右边</p> <p>垂直合并：保留上边，删除下边</p> <table border="1" width="600px" height="400px"> <tr> <td>单元格1</td> <td>单元格2</td> <td>单元格3</td> <td>单元格4</td> <td>单元格5</td> </tr> <tr> <td colspan="2">单元格6单元格7</td> <td>单元格8</td> <td>单元格9</td> <td>单元格10</td> </tr> <tr> <td>单元格11</td> <td>单元格12</td> <td rowspan="3">单元格13、18、23</td> <td>单元格14</td> <td rowspan="2">单元格15、20</td> </tr> <tr> <td colspan="2" rowspan="2">单元格16、17、21、22</td> <td>单元格19</td> </tr> <tr> <td>单元格24</td> <td>单元格25</td> </tr> </table> </body> </html> </code></pre> <h1>15.Form表单</h1> 作用：让网站具有交互性 表单在Web网页中用来给用户填写信息，从而能采用户信息，使网页具有交互的功能。 所有的用户输入内容的地方都用表单来写，如登录注册、搜索框 表单是由容器和控件组成的，一个表单一般应该包含用户填写信息的输入框，按钮等，这些输入框，按钮叫控件，表单就是容器，它能够容纳各种各样的控件 <pre><code class="prism language-html"><form action="url" method="get|post" name="myform"></form> </code></pre> 属性说明 action服务器地址 name表单名称 method中Get和Post的区别 <ol> <li>数据提交方式，get把提交的数据url可以看到，post看不到</li> <li>get一般用于提交少量数据，post用来提交大量数据</li> </ol> <h2>15.1 表单元素（可理解为表单控件）</h2> 一个完整的表单包含三个基本组成部分：表单标签（）、表单域（输入框）、表单按钮（button按钮） 1.表单标签 2.表单域 3.表单按钮 <pre><code class="prism language-html"><form> <input type="text"> <input type="submit"> </form> </code></pre> <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <form action="url" method="get|post" name="myform"></form> <form> <input> <input type="submit"> <button>按钮</button> </form> <form> <input type="text"> <input type="submit"> </form> </body> </html> </code></pre> <h1>16.表单元素</h1> <h2>16.1 文本框</h2> 文本域通过<code><input type="text"></code>标签来设定，当用户要在表单中键入字母、数字等内容时，就会用到文本域 <pre><code class="prism language-html"><form> First name:<input type="text" name="firstname"> <br> Last name:<input type="test" name="lastname"> </form> </code></pre> <h2>16.2 密码框</h2> 密码字段通过标签<code><input type="password"></code>来定义 <pre><code class="prism language-html"><form> Password:<input type="password" name="pwd"> </form> </code></pre> <h2>16.3 提交按钮</h2> 当用户单击确认按钮时，表单的内容会被传送到另一个文件。表单的动作属性定义了目的文件的文件名。由动作属性定义的这个文件通常会对接收到的输入数据进行相关的处理。 <pre><code class="prism language-html"><form name="input" action="url" method="get"> Username:<input type="text" name="user"> <input type="submit" value="Submit"> </form> </code></pre> <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <form> <input type="text"> <input type="submit"> </form> <form> 用户名：<input type="text"> <br> 密码：<input type="password"> <br> <input type="submit" value="登入"> </form> </body> </html> </code></pre> <h1>17.块元素与行内元素（内联元素）</h1> html5之前元素分为块级元素和内联元素； html5之后按内容模型来区分，分为元数据型、区块型、标题型、文档流型、语句型、内嵌型、交互型。元素不属于任何一个类别，被称为穿透的，元素可能属于不止一个类别，称为混合的。 内联元素和块级元素的区别 <table> <thead> <tr> <th>块级元素</th> <th>内联元素</th> </tr> </thead> <tbody> <tr> <td>块元素会在页面中独占一行（自上向下垂直排列）</td> <td>行内元素不会独占页面中的一行，只占自身的大小</td> </tr> <tr> <td>可以设置width，height属性</td> <td>行内元素设置width，height属性无效</td> </tr> <tr> <td>一般块级元素可以包含行内元素和其他块级元素</td> <td>一般内联元素包含内联元素不包含块级元素</td> </tr> </tbody> </table> 常见块级元素 <blockquote> div、form、h1~h6、hr、p、table、ul等 </blockquote> 常见内联元素（行内元素） <blockquote> a、b、em、i、span、strong等 </blockquote> 行内块级元素（特点：不换行、能够识别宽高） <blockquote> button、img、input等 </blockquote> <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <h1>标签</h1> <p>段落</p> <ul> <li>列表1</li> <li>列表2</li> </ul> <a href="#">超链接</a> <span>内容</span> <em width="400px">注重语气</em> <img width="300px" src="2.webp" alt=""> <img src="2.webp" alt=""> </body> </html> </code></pre> <h1>18.HTML5新增标签</h1> 目的：新增布局标签利于SEO <h2>18.1 拓展知识</h2> <code>div</code>容器元素，也是页面中见到的最多的元素。本身没有任何样式效果。 <h2>18.2 H5新标签</h2> <ol> <li><code><head></head></code>头部</li> <li><code><nav></nav></code>导航</li> <li><code><section></section></code>定义文档中的节，比如章节、页眉、页脚</li> <li><code><aside></aside></code>侧边栏</li> <li><code><footer></footer></code>脚部</li> <li><code><article></article></code>代表一个独立的、完整的相关内容块，例如一篇完整的论坛帖子，一篇博客文章，一个用户评论等。</li> </ol> <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <h3>标签</h3> <a href="#">超链接</a> <strong>文本</strong> <p>段落</p> <ul> <li>列表</li> </ul> <table> <tr> <td>单元格</td> </tr> </table> <div> <ul> <li>导航1</li> <li>导航2</li> <li>导航3</li> </ul> </div> <div> <img src="" alt=""> </div> <div> <img src="" alt=""> <p> </p> </div>  <div id="header"></div> <div id="nav"></div> <div id="article"> <div id="section"></div> </div> <div id="silder"></div> <div id="footer"></div>  <header></header> <nav></nav> <article> <section></section> </article> <aside></aside> <footer></footer> </body> </html> </code></pre> </div> </div> </div> </div> </div>  <div id="SOHUCS" sid="1691980630260264960"></div> <script type="text/javascript" src="/views/front/js/chanyan.js"></script>  <div class="youdao-fixed-ad" id="detail_ad_bottom"></div> </div> <div class="col-md-3"> <div class="row" id="ad">  <div id="right-1" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_1"> </div> </div>  <div id="right-2" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_2"></div> </div>  <div id="right-3" class="col-lg-12 col-md-12 col-sm-4 col-xs-4 ad"> <div class="youdao-fixed-ad" id="detail_ad_3"></div> </div> </div> </div> </div> </div> </div> <div class="container"> <h4 class="pt20 mb15 mt0 border-top">你可能感兴趣的:(web前端开发基础,前端,html5,css3)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1902664210089832448.htm" title="浏览器开发者工具深度调试指南：从入门到高阶技巧" target="_blank">浏览器开发者工具深度调试指南：从入门到高阶技巧</a> 109702008 <a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B/1.htm">编程</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a> <div>浏览器开发者工具（DevTools）是现代前端工程师的"瑞士军刀"，本文将系统解析其核心功能与实战技巧，助您掌握高效调试的终极奥义。一、基础操作与核心功能1.1工具启动方式快捷键：F12（Win/Linux）|Cmd+Opt+I（Mac）右键菜单：网页任意位置右键→检查（Inspect）移动端调试：启用设备模式（Ctrl+Shift+M）1.2核心面板全景图面板名称核心功能快捷键切换Element</div> </li> <li><a href="/article/1902659669063692288.htm" title="《React开发实践：掌握Redux与Hooks应用》——开启你的前端进阶之旅" target="_blank">《React开发实践：掌握Redux与Hooks应用》——开启你的前端进阶之旅</a> JJCTO袁龙 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a> <div>文章标题《React开发实践：掌握Redux与Hooks应用》——开启你的前端进阶之旅在前端开发的浪潮中，React.js已经成为开发者们不可或缺的利器。它以其高效、灵活的特性，成为构建现代Web应用的首选框架之一。然而，随着项目复杂度的增加，如何更好地管理状态、优化性能、提升代码可维护性，成为每个开发者必须面对的挑战。幸运的是，我最近出版的《React开发实践：掌握Redux与Hooks应用》这</div> </li> <li><a href="/article/1902659037737054208.htm" title="Webpack常见面试题总结" target="_blank">Webpack常见面试题总结</a> xiangzhihong8 <a class="tag" taget="_blank" href="/search/React/1.htm">React</a><a class="tag" taget="_blank" href="/search/Native/1.htm">Native</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>一、谈谈你对Webpack的理解1.1背景Webpack的目标是实现前端项目的模块化，从而更高效地管理和维护项目中的每一个资源。在早期的前端项目中，我们通过文件划分的形式来实现模块化，也就是将每个功能及其相关状态数据各自单独放到不同的JS文件中。约定每个文件是一个独立的模块，然后再将这些js文件引入到页面，一个script标签对应一个模块，然后再调用模块化的成员。比如：但这种模块化开发的弊端也十分</div> </li> <li><a href="/article/1902656013656453120.htm" title="最完整的webpack Dll打包与采坑总结" target="_blank">最完整的webpack Dll打包与采坑总结</a> 仰望星空的代码 <a class="tag" taget="_blank" href="/search/Vue.js%E8%B8%A9%E5%9D%91%E8%AE%B0/1.htm">Vue.js踩坑记</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/dll%E6%89%93%E5%8C%85/1.htm">dll打包</a><a class="tag" taget="_blank" href="/search/%E6%89%93%E5%8C%85%E4%BC%98%E5%8C%96/1.htm">打包优化</a> <div>webpack已经成为前端主流的项目打包工具，对于前端开发必不可少。在前端项目依赖第三方库过多，项目比较大文件比较多时，webpack打包的速度也会被拖成蜗牛，是时候优化一下webapck的打包速度了。在优化打包速度方面有不少方法方式，其中一个比较重要的方式是DllPlugin。DllPlugin把第三方库打包成动态链接库（动态链接库：windows系统中库文件概念，这里是借用了这一概念。），Dl</div> </li> <li><a href="/article/1902646431789936640.htm" title="前端开发：Webpack的使用总结" target="_blank">前端开发：Webpack的使用总结</a> 三掌柜666 <a class="tag" taget="_blank" href="/search/web%E5%89%8D%E7%AB%AF%E7%9F%A5%E8%AF%86%E6%B1%87%E6%80%BB/1.htm">web前端知识汇总</a><a class="tag" taget="_blank" href="/search/webpack/1.htm">webpack</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>前言在前端开发过程中，尤其是现在前端框架的频繁使用的当下，作为前端开发者想必对于Webpack并不陌生，尤其是在使用Vue框架做前端开发的时候，打包时候必用Webpack。还有就是在前端求职面试的时候，Webpack相关的知识点也是面试官必定考察的，那么本篇博文就来分享一下关于Webpack使用相关的知识点，记录下来，方便后期查阅使用。Webpack概念Webpack其实是一个前端资源加载/打包工</div> </li> <li><a href="/article/1902636351883374592.htm" title="UNI-APP+VUE3+VITE+VSCode开发经验及填坑记录（持续更新ING）" target="_blank">UNI-APP+VUE3+VITE+VSCode开发经验及填坑记录（持续更新ING）</a> 集成显卡 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E9%A1%B9%E7%9B%AE%E5%AE%9E%E8%B7%B5/1.htm">项目实践</a><a class="tag" taget="_blank" href="/search/uni-app/1.htm">uni-app</a><a class="tag" taget="_blank" href="/search/vscode/1.htm">vscode</a><a class="tag" taget="_blank" href="/search/ide/1.htm">ide</a> <div>uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。快速开发模板unibest：最好的uniapp开发框架，由uniapp+Vue3+Ts+Vite5+UnoCss+VSCode(可选webstorm)+uni插件+wot-ui（</div> </li> <li><a href="/article/1902619196961910784.htm" title="【Spring AI】基于专属知识库的RAG智能问答小程序开发——代码逐行精讲：核心交互函数及RAG知识库构建" target="_blank">【Spring AI】基于专属知识库的RAG智能问答小程序开发——代码逐行精讲：核心交互函数及RAG知识库构建</a> un_fired <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>系列文章目录【SpringAI】基于专属知识库的RAG智能问答小程序开发——完整项目（含完整前端+后端代码）【SpringAI】基于专属知识库的RAG智能问答小程序开发——代码逐行精讲：核心ChatClient对象相关构造函数【SpringAI】基于专属知识库的RAG智能问答小程序开发——代码逐行精讲：核心交互函数及RAG知识库构建文章目录系列文章目录前言1.Service层知识库构建与检索函数详</div> </li> <li><a href="/article/1902613138394640384.htm" title="个人AI助手的未来：Yi AI开源系统助力快速搭建" target="_blank">个人AI助手的未来：Yi AI开源系统助力快速搭建</a> 耶耶Norsea <a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E6%9D%82%E7%83%A9/1.htm">网络杂烩</a><a class="tag" taget="_blank" href="/search/%E4%BA%BA%E5%B7%A5%E6%99%BA%E8%83%BD/1.htm">人工智能</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E6%BA%90/1.htm">开源</a> <div>摘要YiAI推出了一站式个人AI助手平台解决方案，助力用户快速搭建专属AI助手。该平台采用全套开源系统，涵盖前端应用、后台管理及小程序功能，并基于MIT协议开放使用。同时，平台集成了本地RAG方案，利用Milvus与Weaviate向量数据库支持本地部署，为用户提供高效、灵活的数据处理能力。关键词个人AI助手,快速搭建,开源系统,本地RAG,向量数据库一、YiAI开源系统概述1.1个人AI助手的发</div> </li> <li><a href="/article/1902611621285523456.htm" title="CSS3背景与渐变" target="_blank">CSS3背景与渐变</a> 天涯学馆 <a class="tag" taget="_blank" href="/search/%E5%A4%A7%E5%89%8D%E7%AB%AF%26amp%3B%E7%A7%BB%E5%8A%A8%E7%AB%AF%E5%85%A8%E6%A0%88%E6%9E%B6%E6%9E%84/1.htm">大前端&移动端全栈架构</a><a class="tag" taget="_blank" href="/search/css3/1.htm">css3</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/css/1.htm">css</a> <div>背景与渐变background-sizebackground-size属性用于设置背景图像的尺寸。您可以指定绝对或相对单位，或者使用关键词来控制背景图像在元素背景区域中的大小。.element{background-size:[length|percentage|cover|contain]|[length|percentage][length|percentage]|auto|inherit;}</div> </li> <li><a href="/article/1902599516868112384.htm" title="2025React岗位前端面试题180道及其答案解析,看完稳了,万字长文,持续更新...." target="_blank">2025React岗位前端面试题180道及其答案解析,看完稳了,万字长文,持续更新....</a> 祈澈菇凉 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>1.什么是React？它的主要特点是什么？答案解析：React是一个用于构建用户界面的JavaScript库，主要用于构建单页应用。其主要特点包括：组件化：React应用由多个可重用的组件组成，便于管理和维护。虚拟DOM：React使用虚拟DOM提高性能，通过最小化实际DOM操作来优化渲染过程。单向数据流：数据在组件之间以单向流动的方式传递，简化了数据管理和调试。声明式编程：React允许开发者以</div> </li> <li><a href="/article/1902594848398045184.htm" title="Python前端开发" target="_blank">Python前端开发</a> PITSU <a class="tag" taget="_blank" href="/search/%E6%AD%A3%E5%88%99%E8%A1%A8%E8%BE%BE%E5%BC%8F/1.htm">正则表达式</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/css3/1.htm">css3</a><a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>Python前端开发1.前端三剑客（HTML，CSS和JavaScript）1.1HTML1.1.1HTML简介HyperTextMark-upLanguage,指的是超文本标记语言；html是开发网页的语言；html中的标签大多数都是成对出现的,格式:1.1.2HTML结构第一行是文档声明部分HTML：分为页头，页身和页脚。标签大部分是成对出现1.1.3第一行文档声明部分HTML在vscode中</div> </li> <li><a href="/article/1902581729210724352.htm" title="FastAPI测试策略：参数解析单元测试" target="_blank">FastAPI测试策略：参数解析单元测试</a> qcidyu <a class="tag" taget="_blank" href="/search/%E6%96%87%E7%AB%A0%E5%BD%92%E6%A1%A3/1.htm">文章归档</a><a class="tag" taget="_blank" href="/search/%E5%BC%82%E5%B8%B8%E4%BC%A0%E6%92%AD%E9%AA%8C%E8%AF%81/1.htm">异常传播验证</a><a class="tag" taget="_blank" href="/search/%E4%BE%9D%E8%B5%96%E6%B3%A8%E5%85%A5%E6%B5%8B%E8%AF%95/1.htm">依赖注入测试</a><a class="tag" taget="_blank" href="/search/%E8%AF%B7%E6%B1%82%E6%A8%A1%E6%8B%9F%E6%8A%80%E6%9C%AF/1.htm">请求模拟技术</a><a class="tag" taget="_blank" href="/search/%E6%B5%8B%E8%AF%95%E8%A6%86%E7%9B%96%E7%8E%87%E4%BC%98%E5%8C%96/1.htm">测试覆盖率优化</a><a class="tag" taget="_blank" href="/search/Pydantic%E9%AA%8C%E8%AF%81%E6%B5%8B%E8%AF%95/1.htm">Pydantic验证测试</a><a class="tag" taget="_blank" href="/search/%E5%8D%95%E5%85%83%E6%B5%8B%E8%AF%95%E7%AD%96%E7%95%A5/1.htm">单元测试策略</a><a class="tag" taget="_blank" href="/search/%E5%8F%82%E6%95%B0%E8%A7%A3%E6%9E%90%E6%B5%8B%E8%AF%95/1.htm">参数解析测试</a> <div>扫描二维码关注或者微信搜一搜：编程智域前端至全栈交流与成长探索数千个预构建的AI应用，开启你的下一个伟大创意第一章：核心测试方法论1.1三层测试体系架构#第一层：模型级测试deftest_user_model_validation():withpytest.raises(ValidationError):User(age=-5)#第二层：依赖项测试deftest_auth_dependency()</div> </li> <li><a href="/article/1902578448728125440.htm" title="【前端网络深潜行者】信息化人员必备知识&面试宝典：TCP连接中断，客户端突然“玩失踪”怎么办？" target="_blank">【前端网络深潜行者】信息化人员必备知识&面试宝典：TCP连接中断，客户端突然“玩失踪”怎么办？</a> DTcode7 <a class="tag" taget="_blank" href="/search/IT%E4%BF%A1%E6%81%AF%E6%8A%80%E6%9C%AF%E7%9B%B8%E5%85%B3/1.htm">IT信息技术相关</a><a class="tag" taget="_blank" href="/search/%23/1.htm">#</a><a class="tag" taget="_blank" href="/search/%E4%BF%A1%E6%81%AF%E5%8C%96%E6%8A%80%E8%83%BD%E9%9D%A2%E8%AF%95%E5%AE%9D%E5%85%B8/1.htm">信息化技能面试宝典</a><a class="tag" taget="_blank" href="/search/HTML5/1.htm">HTML5</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E4%B8%89%E5%A4%A7%E6%A0%B8%E5%BF%83/1.htm">前端三大核心</a><a class="tag" taget="_blank" href="/search/JS/1.htm">JS</a> <div>【前端网络深潜行者】信息化人员必备知识&面试宝典：TCP连接中断，客户端突然“玩失踪”怎么办？TCP的忠诚卫士：保活与重传保活机制（Keepalive）超时重传与超时前端策略：优雅的应对与重连案例一：心跳检测案例二：断线重连逻辑安全与性能考量实战经验之谈排错思路结语与探讨在网络通信的迷宫中，TCP/IP协议犹如稳固的桥梁，承载着数据的往来。然而，当客户端这个“信使”突然玩起了失踪”，我们如何确保这</div> </li> <li><a href="/article/1902577816931725312.htm" title="【微信小程序变通实现DeepSeek支持语音】" target="_blank">【微信小程序变通实现DeepSeek支持语音】</a> 技术与健康 <a class="tag" taget="_blank" href="/search/%E5%BE%AE%E4%BF%A1%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">微信小程序</a><a class="tag" taget="_blank" href="/search/%E5%B0%8F%E7%A8%8B%E5%BA%8F/1.htm">小程序</a> <div>微信小程序实现录音转文字，并调用后端服务（Node.js）进行语音识别和，然后调用DeepSeek处理的完整实现。整体架构前端（微信小程序）：实现录音功能。将录音文件上传到后端。接收后端返回的语音识别结果，并显示在可编辑的文本框中。调用DeepSeek处理文本。后端（Node.js）：接收小程序上传的录音文件。调用腾讯云语音识别（ASR）服务，将语音转换为文字。返回识别结果给小程序。提供DeepS</div> </li> <li><a href="/article/1902573271463817216.htm" title="localStorage在上面位置？数据存放文件名是什么？" target="_blank">localStorage在上面位置？数据存放文件名是什么？</a> 2301_79698214 <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>在上述代码中，数据并不是以传统文件的形式存放在某个具体的文件里，而是存储在浏览器的localStorage中。localStorage是HTML5新增的一个会话存储对象，它用于临时保存同一窗口（或标签页）的数据，在关闭窗口或标签页后数据仍然存在。数据存储位置和文件名存储位置：localStorage是浏览器提供的一个存储机制，数据存储在浏览器的本地存储区域，不同的浏览器存储位置不同，例如：Chro</div> </li> <li><a href="/article/1902558531052171264.htm" title="微前端 qiankun vite vue3" target="_blank">微前端 qiankun vite vue3</a> 可缺不可滥 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E9%A1%B9%E7%9B%AE%E6%A1%86%E6%9E%B6/1.htm">前端项目框架</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>文章目录简介主应用qiankun-mainvue3vite子应用qiankun-app-vue2webpack5子应用qiankun-reactwebpack5子应用quankun-vue3vite遇到的问题简介主要介绍以qiankun框架为基础，vite搭建vue3项目为主应用，wepackvue2和webpackreact搭建的子应用，形成的一个微前端框架。主应用qiankun-mainvue</div> </li> <li><a href="/article/1902542509297430528.htm" title="【Vue+TypeScript实战指南：提高代码质量和开发效率】" target="_blank">【Vue+TypeScript实战指南：提高代码质量和开发效率】</a> 小怪兽9699 <a class="tag" taget="_blank" href="/search/typescript/1.htm">typescript</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>前言在现代前端开发中，Vue.js是一个非常流行且强大的框架，而TypeScript则是增强代码类型安全性和可维护性的利器。本文将详细介绍如何结合Vue和TypeScript来构建高质量的应用程序。无论你是有一定基础的开发者还是希望进一步提升技能的高手，本文都将为你提供详细的步骤和代码示例。1.环境搭建首先，确保你已经安装了Node.js和npm。然后，全局安装VueCLI：npminstall-</div> </li> <li><a href="/article/1902542130807631872.htm" title="若依框架入门指南：快速上手SpringBoot+前后端分离版" target="_blank">若依框架入门指南：快速上手SpringBoot+前后端分离版</a> 小小鸭程序员 <a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a><a class="tag" taget="_blank" href="/search/boot/1.htm">boot</a><a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF/1.htm">后端</a><a class="tag" taget="_blank" href="/search/intellij-idea/1.htm">intellij-idea</a> <div>若依（RuoYi）是一款基于SpringBoot的快速开发平台，集成了权限管理、代码生成、监控管理等功能。本文将以SpringBoot+Vue前后端分离版本为例，带你快速上手若依框架。一、环境准备基础环境：JDK1.8+MySQL5.7+Redis5.0+Maven3.6+Node.js14+（前端）下载项目：#后端项目gitclonehttps://gitee.com/y_project/Ruo</div> </li> <li><a href="/article/1902539980882898944.htm" title="Vue.js的watch监听" target="_blank">Vue.js的watch监听</a> 阿珊和她的猫 <a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》、《前端求职突破计划》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》文章目录引言`watch`选项的基本概念`watch`选项的基本语法`watch</div> </li> <li><a href="/article/1902533552965218304.htm" title="移动端IOS的H5页面被键盘顶起后，底部有一大片空白区域的解决方法" target="_blank">移动端IOS的H5页面被键盘顶起后，底部有一大片空白区域的解决方法</a> 不怕麻烦的鹿丸 <a class="tag" taget="_blank" href="/search/%E6%B5%8F%E8%A7%88%E5%99%A8/1.htm">浏览器</a><a class="tag" taget="_blank" href="/search/HTML5/1.htm">HTML5</a><a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/html5/1.htm">html5</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a> <div>在移动端开发中，当使用HTML5(特别是在Vue.js框架下)构建应用时，经常会遇到键盘弹出导致页面内容被顶起的问题。当键盘收起后，页面未能自动恢复到原来的位置。当键盘弹出时，你可以通过JavaScript监听键盘的显示和隐藏事件，并相应地调整页面的滚动位置。exportdefault{mounted(){window.addEventListener('focusin',this.handleF</div> </li> <li><a href="/article/1902530903490490368.htm" title="【unity&Node.js篇】多人联机游戏开发代码规范" target="_blank">【unity&Node.js篇】多人联机游戏开发代码规范</a> 雅鸦 <a class="tag" taget="_blank" href="/search/unity/1.htm">unity</a><a class="tag" taget="_blank" href="/search/node.js/1.htm">node.js</a><a class="tag" taget="_blank" href="/search/%E4%BB%A3%E7%A0%81%E8%A7%84%E8%8C%83/1.htm">代码规范</a> <div>多人联机游戏前端（Unity）与后端（Node.js）代码规范说明书这份代码规范旨在帮助多人联机游戏的开发团队建立一致性和高质量的代码标准，涵盖前端（Unity）和后端（Node.js）开发部分。无论是游戏逻辑的实现、多人同步机制、网络通信还是错误处理，都需要清晰的规范来确保代码的可维护性、可扩展性与高效性。1.Unity前端代码规范1.1命名规范变量、函数命名：使用PascalCase（大驼峰）</div> </li> <li><a href="/article/1902512115617427456.htm" title="python-56-基于Vue和Flask进行前后端分离的项目开发示例实战" target="_blank">python-56-基于Vue和Flask进行前后端分离的项目开发示例实战</a> 皮皮冰燃 <a class="tag" taget="_blank" href="/search/python3/1.htm">python3</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/flask/1.htm">flask</a> <div>文章目录1创建Vue前端项目1.1运行demo1.2实现需求2flask部署上述dist(前后端未分离)2.1代码app.py2.2运行访问3nginx部署(前后端分离)3.1nginx前端服务3.3.1windows安装nginx3.3.2修改nginx.conf配置文件3.3.3启动nginx3.3.3停止nginx3.2启动后端服务3.2.1app.py(去除前端渲染)3.2.2启动flas</div> </li> <li><a href="/article/1902504163389009920.htm" title="pipost 如何提升团队协作效率 [特殊字符]" target="_blank">pipost 如何提升团队协作效率 [特殊字符]</a> Kairo_01 <a class="tag" taget="_blank" href="/search/postman/1.htm">postman</a> <div>开发团队中的沟通障碍在许多开发团队中，前端工程师、后端工程师和QA测试人员之间的同步往往会浪费大量时间。不断的会议和对齐会话减慢了整个过程，严重影响了生产力。以下是一些常见的痛点：前端和后端团队需要不断对API接口进行同步。测试人员必须反复确认API行为。产品经理必须确保每个人都对项目需求达成一致。这些沟通障碍导致开发周期延长、团队士气下降和项目发布推迟。通过Apipost提高协作效率1.精简的A</div> </li> <li><a href="/article/1902499499805306880.htm" title="现代前端开发框架对比：React、Vue 和 Svelte 的选择指南" target="_blank">现代前端开发框架对比：React、Vue 和 Svelte 的选择指南</a> zhyoobo <a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/react.js/1.htm">react.js</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>引言在当今快速发展的Web开发领域，前端框架的选择往往直接影响项目的开发效率、维护成本和用户体验。React、Vue和Svelte作为当前最受关注的三大框架，各自拥有独特的设计哲学与技术实现。本文将通过5000字的深度解析，从架构设计、开发体验、性能特征到生态系统四个维度进行全方位对比，并针对不同场景提供选型决策框架。无论您是初创团队的技术负责人，还是正在构建企业级应用的架构师，都能在此找到面向2</div> </li> <li><a href="/article/1902496972112195584.htm" title="`fetch` 和 `axios`的前端使用区别" target="_blank">`fetch` 和 `axios`的前端使用区别</a> Studying_swz <a class="tag" taget="_blank" href="/search/blog/1.htm">blog</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>欢迎访问的个人博客：https://swzbk.site/，加好友，拉你入福利群fetch和axios`是前端常用的两种HTTP客户端，以下是它们的核心区别及适用场景：一、本质区别特性fetchaxios类型浏览器原生API（部分环境需polyfill）第三方库（需通过npm/yarn安装）底层实现基于Promise基于Promise，封装了XMLHttpRequest二、核心功能对比1.请求与响</div> </li> <li><a href="/article/1902480323464196096.htm" title="LORA的魔法棒：在Stable Diffusion中挥洒注意力机制的优化咒语 ??" target="_blank">LORA的魔法棒：在Stable Diffusion中挥洒注意力机制的优化咒语 ??</a> DTcode7 <a class="tag" taget="_blank" href="/search/AI%E7%94%9F%E4%BA%A7%E5%8A%9B/1.htm">AI生产力</a><a class="tag" taget="_blank" href="/search/AI/1.htm">AI</a><a class="tag" taget="_blank" href="/search/AIGC/1.htm">AIGC</a><a class="tag" taget="_blank" href="/search/stable/1.htm">stable</a><a class="tag" taget="_blank" href="/search/diffusion/1.htm">diffusion</a><a class="tag" taget="_blank" href="/search/AI%E7%94%9F%E4%BA%A7%E5%8A%9B/1.htm">AI生产力</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E6%B2%BF/1.htm">前沿</a> <div>LORA的魔法棒：在StableDiffusion中挥洒注意力机制的优化咒语??欢迎来到我的博客，很高兴能够在这里和您见面！希望您在这里可以感受到一份轻松愉快的氛围，不仅可以获得有趣的内容和知识，也可以畅所欲言、分享您的想法和见解。推荐：DTcode7的博客首页。一个做过前端开发的产品经理，经历过睿智产品的折磨导致脱发之后，励志要翻身农奴把歌唱，一边打入敌人内部一边持续提升自己，为我们广大开发同胞</div> </li> <li><a href="/article/1902475327892942848.htm" title="policy_does_not_allow_file_overwrite" target="_blank">policy_does_not_allow_file_overwrite</a> <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AFuniapp%E4%BA%91%E5%AD%98%E5%82%A8/1.htm">前端uniapp云存储</a> <div>uniapp云开发阿里云上传文件uniapp的出现，让前端人员和后端人员实现了“全栈”的小梦想，当然，真正跨端开发的时候，还是会遇到不少的问题，比如今天我们的主角，uniCloud.uploadFile,一般来说，这个api文件名动态生成，云端返回文件存储的链接即可，但是，假如我们的产品是针对用户存储的，即用户的头像、私有文件、图片等具有唯一性，要单独开个目录存放的时候，同样的文件名上传会存在无法</div> </li> <li><a href="/article/1902424833795354624.htm" title="Python,C++开发餐饮后厨环境远程管理APP" target="_blank">Python,C++开发餐饮后厨环境远程管理APP</a> Geeker-2025 <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/c%2B%2B/1.htm">c++</a> <div>开发一款用于**餐饮后厨环境远程管理**的App，结合Python和C++的优势，可以实现高效的后端数据处理、实时的环境监控以及用户友好的前端界面。以下是一个详细的开发方案，涵盖技术选型、功能模块、开发步骤等内容。##技术选型###后端（Python）-**编程语言**：Python-**Web框架**：Django或Flask-**数据库**：PostgreSQL或MySQL-**实时通信**：</div> </li> <li><a href="/article/1902416547855527936.htm" title="深入解析：React中的信号组件与细粒度更新" target="_blank">深入解析：React中的信号组件与细粒度更新</a> <div>引言在主流的前端开发框架中，无论是React、Vue还是Svelte，核心都是围绕着更高效地进行UI渲染展开的。为了实现高性能，基于DOM总是比较慢这个假设前提，其最核心的要解决的问题有两个：响应式更新细粒度更新为了将响应式更新、细粒度更新优化到极致，各种框架是八仙过海，各显神通。以最流行的React和Vue为例，首先两者均引入了VirtualDOM的概念。Vue的静态模板编译，通过编译时的静态分</div> </li> <li><a href="/article/1902412261935345664.htm" title="SvelteKit 最新中文文档教程（6）—— 状态管理" target="_blank">SvelteKit 最新中文文档教程（6）—— 状态管理</a> <div>前言Svelte，一个语法简洁、入门容易，面向未来的前端框架。从Svelte诞生之初，就备受开发者的喜爱，根据统计，从2019年到2024年，连续6年一直是开发者最感兴趣的前端框架No.1：Svelte以其独特的编译时优化机制著称，具有轻量级、高性能、易上手等特性，非常适合构建轻量级Web项目。为了帮助大家学习Svelte，我同时搭建了Svelte最新的中文文档站点。如果需要进阶学习，也可以入手我</div> </li> <li><a href="/article/46.htm" title="Maven" target="_blank">Maven</a> Array_06 <a class="tag" taget="_blank" href="/search/eclipse/1.htm">eclipse</a><a class="tag" taget="_blank" href="/search/jdk/1.htm">jdk</a><a class="tag" taget="_blank" href="/search/maven/1.htm">maven</a> <div>Maven Maven是基于项目对象模型(POM)，信息来管理项目的构建，报告和文档的软件项目管理工具。 Maven 除了以程序构建能力为特色之外，还提供高级项目管理工具。由于 Maven 的缺省构建规则有较高的可重用性，所以常常用两三行 Maven 构建脚本就可以构建简单的项目。由于 Maven 的面向项目的方法，许多 Apache Jakarta 项目发文时使用 Maven，而且公司</div> </li> <li><a href="/article/173.htm" title="ibatis的queyrForList和queryForMap区别" target="_blank">ibatis的queyrForList和queryForMap区别</a> bijian1013 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/ibatis/1.htm">ibatis</a> <div>一.说明 iBatis的返回值参数类型也有种：resultMap与resultClass，这两种类型的选择可以用两句话说明之： 1.当结果集列名和类的属性名完全相对应的时候，则可直接用resultClass直接指定查询结果类</div> </li> <li><a href="/article/300.htm" title="LeetCode[位运算] - #191 计算汉明权重" target="_blank">LeetCode[位运算] - #191 计算汉明权重</a> Cwind <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E4%BD%8D%E8%BF%90%E7%AE%97/1.htm">位运算</a><a class="tag" taget="_blank" href="/search/LeetCode/1.htm">LeetCode</a><a class="tag" taget="_blank" href="/search/Algorithm/1.htm">Algorithm</a><a class="tag" taget="_blank" href="/search/%E9%A2%98%E8%A7%A3/1.htm">题解</a> <div>原题链接：#191 Number of 1 Bits 要求：写一个函数，以一个无符号整数为参数，返回其汉明权重。例如，‘11’的二进制表示为'00000000000000000000000000001011', 故函数应当返回3。汉明权重：指一个字符串中非零字符的个数；对于二进制串，即其中‘1’的个数。难度：简单分析：将十进制参数转换为二进制，然后计算其中1的个数即可。 “</div> </li> <li><a href="/article/427.htm" title="浅谈java类与对象" target="_blank">浅谈java类与对象</a> 15700786134 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> java是一门面向对象的编程语言，类与对象是其最基本的概念。所谓对象，就是一个个具体的物体，一个人，一台电脑，都是对象。而类，就是对象的一种抽象，是多个对象具有的共性的一种集合，其中包含了属性与方法，就是属于该类的对象所具有的共性。当一个类创建了对象，这个对象就拥有了该类全部的属性，方法。相比于结构化的编程思路，面向对象更适用于人的思维</div> </li> <li><a href="/article/554.htm" title="linux下双网卡同一个IP" target="_blank">linux下双网卡同一个IP</a> 被触发 <a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>转自： http://q2482696735.blog.163.com/blog/static/250606077201569029441/ 由于需要一台机器有两个网卡，开始时设置在同一个网段的IP，发现数据总是从一个网卡发出，而另一个网卡上没有数据流动。网上找了下，发现相同的问题不少：一、关于双网卡设置同一网段IP然后连接交换机的时候出现的奇怪现象。当时没有怎么思考、以为是生成树</div> </li> <li><a href="/article/681.htm" title="安卓按主页键隐藏程序之后无法再次打开" target="_blank">安卓按主页键隐藏程序之后无法再次打开</a> 肆无忌惮_ <a class="tag" taget="_blank" href="/search/%E5%AE%89%E5%8D%93/1.htm">安卓</a> <div>遇到一个奇怪的问题，当SplashActivity跳转到MainActivity之后，按主页键，再去打开程序，程序没法再打开（闪一下），结束任务再开也是这样，只能卸载了再重装。而且每次在Log里都打印了这句话"进入主程序"。后来发现是必须跳转之后再finish掉SplashActivity 本来代码： // 销毁这个Activity fin</div> </li> <li><a href="/article/808.htm" title="通过cookie保存并读取用户登录信息实例" target="_blank">通过cookie保存并读取用户登录信息实例</a> 知了ing <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>通过cookie的getCookies()方法可获取所有cookie对象的集合；通过getName()方法可以获取指定的名称的cookie；通过getValue()方法获取到cookie对象的值。另外，将一个cookie对象发送到客户端，使用response对象的addCookie()方法。下面通过cookie保存并读取用户登录信息的例子加深一下理解。（1）创建index.jsp文件。在改</div> </li> <li><a href="/article/935.htm" title="JAVA 对象池" target="_blank">JAVA 对象池</a> 矮蛋蛋 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/ObjectPool/1.htm">ObjectPool</a> <div>原文地址： http://www.blogjava.net/baoyaer/articles/218460.html Jakarta对象池 ☆为什么使用对象池恰当地使用对象池化技术，可以有效地减少对象生成和初始化时的消耗，提高系统的运行效率。Jakarta Commons Pool组件提供了一整套用于实现对象池化</div> </li> <li><a href="/article/1062.htm" title="ArrayList根据条件+for循环批量删除的方法" target="_blank">ArrayList根据条件+for循环批量删除的方法</a> alleni123 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>场景如下： ArrayList<Obj> list Obj-> createTime, sid. 现在要根据obj的createTime来进行定期清理。（释放内存） ------------------------- 首先想到的方法就是 for(Obj o:list){ if(o.createTime-currentT>xxx){ </div> </li> <li><a href="/article/1189.htm" title="阿里巴巴“耕地宝”大战各种宝" target="_blank">阿里巴巴“耕地宝”大战各种宝</a> 百合不是茶 <a class="tag" taget="_blank" href="/search/%E5%B9%B3%E5%8F%B0%E6%88%98%E7%95%A5/1.htm">平台战略</a> <div>“耕地保”平台是阿里巴巴和安徽农民共同推出的一个 “首个互联网定制私人农场”，“耕地宝”由阿里巴巴投入一亿，主要是用来进行农业方面，将农民手中的散地集中起来不仅加大农民集体在土地上面的话语权，还增加了土地的流通与利用率，提高了土地的产量，有利于大规模的产业化的高科技农业的发展，阿里在农业上的探索将会引起新一轮的产业调整，但是集体化之后农民的个体的话语权将更少，国家应出台相应的法律法规保护</div> </li> <li><a href="/article/1316.htm" title="Spring注入有继承关系的类（1）" target="_blank">Spring注入有继承关系的类（1）</a> bijian1013 <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/spring/1.htm">spring</a> <div>一个类一个类的注入 1.AClass类 package com.bijian.spring.test2; public class AClass { String a; String b; public String getA() { return a; } public void setA(Strin</div> </li> <li><a href="/article/1443.htm" title="30岁转型期你能否成为成功人士" target="_blank">30岁转型期你能否成为成功人士</a> bijian1013 <a class="tag" taget="_blank" href="/search/%E6%88%90%E5%8A%9F/1.htm">成功</a> <div> 很多人由于年轻时走了弯路，到了30岁一事无成，这样的例子大有人在。但同样也有一些人，整个职业生涯都发展得很优秀，到了30岁已经成为职场的精英阶层。由于做猎头的原因，我们接触很多30岁左右的经理人，发现他们在职业发展道路上往往有很多致命的问题。在30岁之前，他们的职业生涯表现很优秀，但从30岁到40岁这一段，很多人</div> </li> <li><a href="/article/1570.htm" title="[Velocity三]基于Servlet+Velocity的web应用" target="_blank">[Velocity三]基于Servlet+Velocity的web应用</a> bit1129 <a class="tag" taget="_blank" href="/search/velocity/1.htm">velocity</a> <div>什么是VelocityViewServlet 使用org.apache.velocity.tools.view.VelocityViewServlet可以将Velocity集成到基于Servlet的web应用中，以Servlet+Velocity的方式实现web应用 Servlet + Velocity的一般步骤 1.自定义Servlet，实现VelocityViewServl</div> </li> <li><a href="/article/1697.htm" title="【Kafka十二】关于Kafka是一个Commit Log Service" target="_blank">【Kafka十二】关于Kafka是一个Commit Log Service</a> bit1129 <a class="tag" taget="_blank" href="/search/service/1.htm">service</a> <div>Kafka is a distributed, partitioned, replicated commit log service.这里的commit log如何理解？ A message is considered "committed" when all in sync replicas for that partition have applied i</div> </li> <li><a href="/article/1824.htm" title="NGINX + LUA实现复杂的控制" target="_blank">NGINX + LUA实现复杂的控制</a> ronin47 <a class="tag" taget="_blank" href="/search/lua+nginx+%E6%8E%A7%E5%88%B6/1.htm">lua nginx 控制</a> <div>安装lua_nginx_module 模块 lua_nginx_module 可以一步步的安装，也可以直接用淘宝的OpenResty Centos和debian的安装就简单了。。这里说下freebsd的安装： fetch http://www.lua.org/ftp/lua-5.1.4.tar.gz tar zxvf lua-5.1.4.tar.gz cd lua-5.1.4 ma</div> </li> <li><a href="/article/1951.htm" title="java-14.输入一个已经按升序排序过的数组和一个数字，在数组中查找两个数，使得它们的和正好是输入的那个数字" target="_blank">java-14.输入一个已经按升序排序过的数组和一个数字，在数组中查找两个数，使得它们的和正好是输入的那个数字</a> bylijinnan <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div> public class TwoElementEqualSum { /** * 第 14 题：题目：输入一个已经按升序排序过的数组和一个数字，在数组中查找两个数，使得它们的和正好是输入的那个数字。要求时间复杂度是 O(n) 。如果有多对数字的和等于输入的数字，输出任意一对即可。例如输入数组 1 、 2 、 4 、 7 、 11 、 15 和数字 15 。由于 </div> </li> <li><a href="/article/2078.htm" title="Netty源码学习-HttpChunkAggregator-HttpRequestEncoder-HttpResponseDecoder" target="_blank">Netty源码学习-HttpChunkAggregator-HttpRequestEncoder-HttpResponseDecoder</a> bylijinnan <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/netty/1.htm">netty</a> <div>今天看Netty如何实现一个Http Server org.jboss.netty.example.http.file.HttpStaticFileServerPipelineFactory： pipeline.addLast("decoder", new HttpRequestDecoder()); pipeline.addLast(&quo</div> </li> <li><a href="/article/2205.htm" title="java敏感词过虑-基于多叉树原理" target="_blank">java敏感词过虑-基于多叉树原理</a> cngolon <a class="tag" taget="_blank" href="/search/%E8%BF%9D%E7%A6%81%E8%AF%8D%E8%BF%87%E8%99%91/1.htm">违禁词过虑</a><a class="tag" taget="_blank" href="/search/%E6%9B%BF%E6%8D%A2%E8%BF%9D%E7%A6%81%E8%AF%8D/1.htm">替换违禁词</a><a class="tag" taget="_blank" href="/search/%E6%95%8F%E6%84%9F%E8%AF%8D%E8%BF%87%E8%99%91/1.htm">敏感词过虑</a><a class="tag" taget="_blank" href="/search/%E5%A4%9A%E5%8F%89%E6%A0%91/1.htm">多叉树</a> <div>基于多叉树的敏感词、关键词过滤的工具包，用于java中的敏感词过滤 1、工具包自带敏感词词库，第一次调用时读入词库，故第一次调用时间可能较长，在类加载后普通pc机上html过滤5000字在80毫秒左右，纯文本35毫秒左右。 2、如需自定义词库，将jar包考入WEB-INF工程的lib目录，在WEB-INF/classes目录下建一个 utf-8的words.dict文本文件，</div> </li> <li><a href="/article/2332.htm" title="多线程知识" target="_blank">多线程知识</a> cuishikuan <a class="tag" taget="_blank" href="/search/%E5%A4%9A%E7%BA%BF%E7%A8%8B/1.htm">多线程</a> <div> T1，T2，T3三个线程工作顺序，按照T1，T2，T3依次进行 public class T1 implements Runnable{ @Override </div> </li> <li><a href="/article/2459.htm" title="spring整合activemq" target="_blank">spring整合activemq</a> dalan_123 <a class="tag" taget="_blank" href="/search/java+spring+jms/1.htm">java spring jms</a> <div>整合spring和activemq需要搞清楚如下的东东1、ConnectionFactory分： a、spring管理连接到activemq服务器的管理ConnectionFactory也即是所谓产生到jms服务器的链接 b、真正产生到JMS服务器链接的ConnectionFactory还得</div> </li> <li><a href="/article/2586.htm" title="MySQL时间字段究竟使用INT还是DateTime？" target="_blank">MySQL时间字段究竟使用INT还是DateTime？</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div> 环境：Windows XPPHP Version 5.2.9MySQL Server 5.1 第一步、创建一个表date_test（非定长、int时间） CREATE TABLE `test`.`date_test` (`id` INT NOT NULL AUTO_INCREMENT ,`start_time` INT NOT NULL ,`some_content`</div> </li> <li><a href="/article/2713.htm" title="Parcel: unable to marshal value" target="_blank">Parcel: unable to marshal value</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/marshal/1.htm">marshal</a> <div>在两个activity直接传递List<xxInfo>时，出现Parcel: unable to marshal value异常。在MainActivity页面（MainActivity页面向NextActivity页面传递一个List<xxInfo>）： Intent intent = new Intent(this, Next</div> </li> <li><a href="/article/2840.htm" title="linux进程的查看上（ps）" target="_blank">linux进程的查看上（ps）</a> eksliang <a class="tag" taget="_blank" href="/search/linux+ps/1.htm">linux ps</a><a class="tag" taget="_blank" href="/search/linux+ps+-l/1.htm">linux ps -l</a><a class="tag" taget="_blank" href="/search/linux+ps+aux/1.htm">linux ps aux</a> <div>ps:将某个时间点的进程运行情况选取下来转载请出自出处：http://eksliang.iteye.com/admin/blogs/2119469 http://eksliang.iteye.com ps 这个命令的man page 不是很好查阅，因为很多不同的Unix都使用这儿ps来查阅进程的状态，为了要符合不同版本的需求，所以这个</div> </li> <li><a href="/article/2967.htm" title="为什么第三方应用能早于System的app启动" target="_blank">为什么第三方应用能早于System的app启动</a> gqdy365 <a class="tag" taget="_blank" href="/search/System/1.htm">System</a> <div>Android应用的启动顺序网上有一大堆资料可以查阅了，这里就不细述了，这里不阐述ROM启动还有bootloader，软件启动的大致流程应该是启动kernel -> 运行servicemanager 把一些native的服务用命令启动起来（包括wifi, power, rild, surfaceflinger, mediaserver等等）-> 启动Dalivk中的第一个进程Zygot</div> </li> <li><a href="/article/3094.htm" title="App Framework发送JSONP请求(3)" target="_blank">App Framework发送JSONP请求(3)</a> hw1287789687 <a class="tag" taget="_blank" href="/search/jsonp/1.htm">jsonp</a><a class="tag" taget="_blank" href="/search/%E8%B7%A8%E5%9F%9F%E8%AF%B7%E6%B1%82/1.htm">跨域请求</a><a class="tag" taget="_blank" href="/search/%E5%8F%91%E9%80%81jsonp/1.htm">发送jsonp</a><a class="tag" taget="_blank" href="/search/ajax%E8%AF%B7%E6%B1%82/1.htm">ajax请求</a><a class="tag" taget="_blank" href="/search/%E8%B6%8A%E7%8B%B1%E8%AF%B7%E6%B1%82/1.htm">越狱请求</a> <div>App Framework 中如何发送JSONP请求呢? 使用jsonp,详情请参考:http://json-p.org/ 如何发送Ajax请求呢? (1)登录 /*** * 会员登录 * @param username * @param password */ var user_login=function(username,password){ // aler</div> </li> <li><a href="/article/3221.htm" title="发福利，整理了一份关于“资源汇总”的汇总" target="_blank">发福利，整理了一份关于“资源汇总”的汇总</a> justjavac <a class="tag" taget="_blank" href="/search/%E8%B5%84%E6%BA%90/1.htm">资源</a> <div>觉得有用的话，可以去github关注：https://github.com/justjavac/awesome-awesomeness-zh_CN 通用 free-programming-books-zh_CN 免费的计算机编程类中文书籍精彩博客集合 hacke2/hacke2.github.io#2 ResumeSample 程序员简历</div> </li> <li><a href="/article/3348.htm" title="用 Java 技术创建 RESTful Web 服务" target="_blank">用 Java 技术创建 RESTful Web 服务</a> macroli <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E7%BC%96%E7%A8%8B/1.htm">编程</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/REST/1.htm">REST</a> <div>转载：http://www.ibm.com/developerworks/cn/web/wa-jaxrs/ JAX-RS (JSR-311) 【 Java API for RESTful Web Services 】是一种 Java™ API，可使 Java Restful 服务的开发变得迅速而轻松。这个 API 提供了一种基于注释的模型来描述分布式资源。注释被用来提供资源的位</div> </li> <li><a href="/article/3475.htm" title="CentOS6.5-x86_64位下oracle11g的安装详细步骤及注意事项" target="_blank">CentOS6.5-x86_64位下oracle11g的安装详细步骤及注意事项</a> 超声波 <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a> <div>前言：这两天项目要上线了，由我负责往服务器部署整个项目，因此首先要往服务器安装oracle，服务器本身是CentOS6.5的64位系统，安装的数据库版本是11g，在整个的安装过程中碰到很多的坑，不过最后还是通过各种途径解决并成功装上了。转别写篇博客来记录完整的安装过程以及在整个过程中的注意事项。希望对以后那些刚刚接触的菜鸟们能起到一定的帮助作用。安装过程中可能遇到的问题（注</div> </li> <li><a href="/article/3602.htm" title="HttpClient 4.3 设置keeplive 和 timeout 的方法" target="_blank">HttpClient 4.3 设置keeplive 和 timeout 的方法</a> supben <a class="tag" taget="_blank" href="/search/httpclient/1.htm">httpclient</a> <div>ConnectionKeepAliveStrategy kaStrategy = new DefaultConnectionKeepAliveStrategy() { @Override public long getKeepAliveDuration(HttpResponse response, HttpContext context) { long keepAlive</div> </li> <li><a href="/article/3729.htm" title="Spring 4.2新特性-@Import注解的升级" target="_blank">Spring 4.2新特性-@Import注解的升级</a> wiselyman <a class="tag" taget="_blank" href="/search/spring+4/1.htm">spring 4</a> <div>3.1 @Import @Import注解在4.2之前只支持导入配置类在4.2,@Import注解支持导入普通的java类,并将其声明成一个bean 3.2 示例演示java类 package com.wisely.spring4_2.imp; public class DemoService { public void doSomethin</div> </li> </ul> </div> </div> </div> <div> <div class="container"> <div class="indexes"> 按字母分类： <a href="/tags/A/1.htm" target="_blank">A</a><a href="/tags/B/1.htm" target="_blank">B</a><a href="/tags/C/1.htm" target="_blank">C</a><a href="/tags/D/1.htm" target="_blank">D</a><a href="/tags/E/1.htm" target="_blank">E</a><a href="/tags/F/1.htm" target="_blank">F</a><a href="/tags/G/1.htm" target="_blank">G</a><a href="/tags/H/1.htm" target="_blank">H</a><a href="/tags/I/1.htm" target="_blank">I</a><a href="/tags/J/1.htm" target="_blank">J</a><a href="/tags/K/1.htm" target="_blank">K</a><a href="/tags/L/1.htm" target="_blank">L</a><a href="/tags/M/1.htm" target="_blank">M</a><a href="/tags/N/1.htm" target="_blank">N</a><a href="/tags/O/1.htm" target="_blank">O</a><a href="/tags/P/1.htm" target="_blank">P</a><a href="/tags/Q/1.htm" target="_blank">Q</a><a href="/tags/R/1.htm" target="_blank">R</a><a href="/tags/S/1.htm" target="_blank">S</a><a href="/tags/T/1.htm" target="_blank">T</a><a href="/tags/U/1.htm" target="_blank">U</a><a href="/tags/V/1.htm" target="_blank">V</a><a href="/tags/W/1.htm" target="_blank">W</a><a href="/tags/X/1.htm" target="_blank">X</a><a href="/tags/Y/1.htm" target="_blank">Y</a><a href="/tags/Z/1.htm" target="_blank">Z</a><a href="/tags/0/1.htm" target="_blank">其他</a> </div> </div> </div> <footer id="footer" class="mb30 mt30"> <div class="container"> <div class="footBglm"> <a target="_blank" href="/">首页</a> - <a target="_blank" href="/custom/about.htm">关于我们</a> - <a target="_blank" href="/search/Java/1.htm">站内搜索</a> - <a target="_blank" href="/sitemap.txt">Sitemap</a> - <a target="_blank" href="/custom/delete.htm">侵权投诉</a> </div> <div class="copyright">版权所有 IT知识库 CopyRight © 2000-2050 E-COM-NET.COM , All Rights Reserved.  </div> </div> </footer>  <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shCore.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shLegacy.js"></script> <script type="text/javascript" src="/static/syntaxhighlighter/scripts/shAutoloader.js"></script> <link type="text/css" rel="stylesheet" href="/static/syntaxhighlighter/styles/shCoreDefault.css"/> <script type="text/javascript" src="/static/syntaxhighlighter/src/my_start_1.js"></script> </body> </html>