csdn小瓯

html标签及基础语法大合集

01-标签语法标签结构

HTML（Hypertext Markup Language）是网页的基础语言之一，它通过使用标签（tag）来描述网页的结构和内容。标签是由尖括号包围的关键词，通常成对出现，其中包括一个开始标签和一个结束标签。开始标签包含元素的名称，而结束标签在元素名称之前加上斜杠。

DOCTYPE html>
<html>
<head>
    <title>标题title>
head>
<body>
    <h1>这是一个标题h1>
    <p>这是一个段落。p>
body>
html>

在上面的例子中，声明了文档类型，告诉浏览器正在使用的是 HTML5 标准。标签包含了整个 HTML 文档的内容，标签中包含了文档的头部信息，如标题等。</code> 标签定义了浏览器工具栏中的标题，而 <code><body></code> 标签包含了可见的页面内容。<code><h1></code> 标签定义了一个最高级别的标题，而 <code></code> 标签定义了一个段落。 尝试一下>>> <h4>02-HTML骨架</h4> HTML骨架指的是网页的基本结构和布局。一个简单的HTML骨架包括了DOCTYPE声明、html标签、head标签和body标签。在这个基本的结构上，我们可以添加不同的元素来构建网页的内容和样式。 <pre><code class="prism language-html"><!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body>  </body> </html> </code></pre> 上面的例子中，<code><!DOCTYPE html></code>声明了HTML文档的类型为HTML5，<code><html></code>标签包裹了整个HTML文档，<code><head></code>标签中包含了文档的头部信息，比如编码、视口设置和标题等，<code><body></code>标签中包含了可见的页面内容。 <blockquote> 提示 VS Code 可以快速生成骨架：在 HTML 文件（.html）中，!（英文）配合 Enter / Tab 键 </blockquote> <h4>03-标签的关系</h4> 在HTML中，标签之间可以有不同的关系，包括嵌套关系和并列关系。嵌套关系指的是一个标签包含在另一个标签内部，形成层级结构。而并列关系指的是同级别的标签在文档中并排出现。 <pre><code class="prism language-html"><div>  <p>这是一个段落。</p>  <div>这是一段文字。</div>  </div> </code></pre> 在上面的例子中，<code><div></code>标签是父级标签，包含了一个<code></code>标签作为子级标签。这种关系可以帮助我们更好地组织和布局页面。 <h4>04-注释</h4> 在HTML中，注释可以帮助开发者在代码中添加说明性文字，但这些文字不会被浏览器渲染出来，只有在查看源代码时才会看到。注释使用<code></code>来包裹。 <pre><code class="prism language-html"> <p>这是一个段落。</p> </code></pre> 上面的例子中，<code></code>标签后面的注释不会在浏览器中显示，但可以帮助其他开发者理解这段代码的作用。 <h4>05-标题标签</h4> 标题标签用于定义网页中的标题文本，它们有多个级别，从<code><h1></code>到<code><h6></code>，表示重要性逐渐降低。 <pre><code class="prism language-html"><h1>这是最重要的标题</h1> <h2>这是次要的标题</h2> <h3>这是又次要的标题</h3> </code></pre> 在网页中，标题标签不仅可以用于显示标题，还可以用于组织页面结构，帮助用户更好地理解页面内容的层次结构。 <h4>06-段落标签</h4> 段落标签 <code></code> 用于定义文本段落，通常用于显示正文内容。 <pre><code class="prism language-html"><p>这是一个段落。</p> <p>这是另一个段落。</p> </code></pre> 在HTML中，段落标签可以帮助我们更好地组织和布局文本内容，使页面看起来更加清晰和有序。 <h4>07-换行和水平线</h4> 在HTML中，可以使用 <code> </code> 标签进行换行，使用 <code><hr></code> 标签插入水平线。 <pre><code class="prism language-html"><p>这是第一行。<br>这是第二行。</p> <hr> <p>这是下一个段落。</p> </code></pre> 使用 <code> </code> 标签可以在段落中强制换行，而 <code><hr></code> 标签可以在文档中插入一条水平线，用于分隔内容。 <h4>08-文本格式化标签</h4> HTML提供了一些标签用于对文本进行格式化，其中包括<code></code>、<code></code>、<code><ins></code>和<code><del></code>标签。 <pre><code class="prism language-html"><p><strong>加粗文本</strong></p> <p><em>斜体文本</em></p> <p><ins>插入文本</ins></p> <p><del>删除文本</del></p> </code></pre> 在上面的例子中，<code></code> 标签用于表示强调的重要文本，通常会显示为粗体字，<code></code> 标签用于表示强调的文本，通常会显示为斜体字，<code><ins></code> 标签用于表示被插入的文本，浏览器通常会对其进行下划线标记，<code><del></code> 标签用于表示被删除的文本，浏览器通常会对其进行删除线标记。 <h4>09-超链接标签</h4> 超链接标签 <code><a></code> 用于创建指向其他网页、文件或位置的链接。 <pre><code class="prism language-html"><a href=" https://www.example.com">这是一个链接</a>   <a href="./01-标签的写法.html" target="_blank">跳转到01-标签的写法</a>  <a href="#">空链接</a> </code></pre> 在上面的例子中，<code><a></code> 标签中的 <code>href</code> 属性指定了链接的目标地址。用户点击这个链接时，浏览器会跳转到指定的网页。 超链接默认是在当前窗口跳转页面，添加 target=“_blank” 实现新窗口打开页面。 拓展：开发初期，不确定跳转地址，则 href 属性值写为 #，表示空链接，页面不会跳转，在当前页面刷新一次。 <h4>10-音频</h4> HTML5引入了<code><audio></code>标签，用于在网页中嵌入音频内容。 <pre><code class="prism language-html"><audio controls autoplay loop> <source src="audio.mp3" type="audio/mp3"> </audio> </code></pre> 在上面的例子中，<code><audio></code> 标签用于定义音频，<code>controls</code> 属性表示显示音频控制面板，<code>loop</code>表示循环播放，<code>autoplay</code>表示自动播放，<code><source></code> 标签用于指定音频文件的来源和类型。 <h4>11-视频</h4> HTML5引入了<code><video></code>标签，用于在网页中嵌入视频内容。 <pre><code class="prism language-html"><video width="320" height="240" controls muted> <source src="movie.mp4" type="video/mp4"> Your browser does not support the video tag. </video> </code></pre> 在上面的例子中，<code><video></code> 标签用于定义视频，<code>width</code> 和 <code>height</code> 属性定义了视频的宽度和高度，<code>controls</code> 属性添加了视频播放器的控件，<code>muted</code>表示静音播放，<code><source></code> 标签用于指定视频文件的来源和类型。 loop，autoplay等属性功能与音频一致。 尝试一下>>> <h4>12-无序列表</h4> 无序列表 <code><ul></code> 用于显示项目之间没有特定顺序的列表。 <pre><code class="prism language-html"><ul> <li>项目1</li> <li>项目2</li> <li>项目3</li> </ul> </code></pre> 在上面的例子中，<code><ul></code> 标签定义了一个无序列表，每个列表项由 <code><li></code> 标签定义。浏览器会自动为无序列表添加项目符号。 <h4>13-有序列表</h4> 有序列表 <code><ol></code> 用于显示项目之间有特定顺序的列表。 <pre><code class="prism language-html"><ol> <li>项目1</li> <li>项目2</li> <li>项目3</li> </ol> </code></pre> 在上面的例子中，<code><ol></code> 标签定义了一个有序列表，每个列表项同样由 <code><li></code> 标签定义。浏览器会自动为有序列表添加编号。 <h4>14-定义列表</h4> 定义列表 <code><dl></code> 用于显示项目及其定义。 <pre><code class="prism language-html"><dl> <dt>苹果</dt> <dd>一种水果</dd> <dt>香蕉</dt> <dd>一种水果</dd> </dl> </code></pre> 在上面的例子中，<code><dl></code> 标签定义了一个定义列表，<code><dt></code> 标签定义了项目的标题，<code><dd></code> 标签定义了项目的描述。 <h4>15-表格-基本使用</h4> 表格 <code><table></code> 用于在网页中展示数据表格。 <pre><code class="prism language-html"><table border="1"> <tr> <th>姓名</th> <th>年龄</th> </tr> <tr> <td>张三</td> <td>25</td> </tr> <tr> <td>李四</td> <td>30</td> </tr> </table> </code></pre> 在上面的例子中，<code><table></code> 标签定义了一个表格，<code>border</code> 属性定义了表格边框的宽度，<code><tr></code> 标签定义了表格的行，<code><th></code> 标签定义了表头单元格，<code><td></code> 标签定义了数据单元格。 <h4>16-表格-表格结构标签</h4> 在表格中，除了 <code><table></code>、<code><tr></code>、<code><th></code> 和 <code><td></code> 这些基本标签外，还有一些用于调整表格结构的标签。 <pre><code class="prism language-html"><table border="1"> <caption>学生信息</caption> <colgroup> <col span="2" style="background-color:yellow"> <col style="background-color:red"> </colgroup> <thead> <tr> <th>姓名</th> <th>年龄</th> <th>性别</th> </tr> </thead> <tbody> <tr> <td>张三</td> <td>25</td> <td>男</td> </tr> <tr> <td>李四</td> <td>30</td> <td>女</td> </tr> </tbody> </table> </code></pre> 在上面的例子中，<code><caption></code> 标签用于定义表格标题，<code><colgroup></code> 标签定义了列的分组，<code><col></code> 标签定义了列的样式，<code><thead></code> 标签定义了表头部分，<code><tbody></code> 标签定义了表格的主体部分。 <h4>17-表格-合并单元格</h4> 在表格中，可以通过合并单元格来合并多个单元格，以便更好地展示数据。 <pre><code class="prism language-html"><table border="1"> <tr> <th colspan="2">姓名</th> <th>年龄</th> </tr> <tr> <td>张三</td> <td>25</td> <td>男</td> </tr> <tr> <td colspan="3">合并单元格</td> </tr> </table> </code></pre> 在上面的例子中，<code>colspan</code> 属性用于水平合并单元格，<code>rowspan</code> 属性用于垂直合并单元格。 <h4>18-表单-input基本使用</h4> 表单 <code><form></code> 用于向服务器传输数据，其中最常见的表单元素之一是输入框 <code><input></code>。 <pre><code class="prism language-html"><form action="/submit" method="post"> <label for="username">用户名：</label> <input type="text" id="username" name="username"><br> <label for="password">密码：</label> <input type="password" id="password" name="password"><br> <input type="submit" value="提交"> </form> </code></pre> 在上面的例子中，<code><form></code> 标签定义了一个表单，<code>action</code> 属性定义了表单数据提交的地址，<code>method</code> 属性定义了数据提交的方式（GET 或 POST），<code><input></code> 标签定义了一个输入框，<code>type</code> 属性定义了输入框的类型，<code>id</code> 属性定义了输入框的唯一标识符，<code>name</code> 属性定义了输入框的名称，<code><label></code> 标签用于定义输入框的标签文本，<code><input type="submit"></code> 标签用于定义提交按钮。 <h4>19-表单-input占位文本</h4> 在输入框中，可以使用占位文本来提示用户输入内容的格式或要求。 <pre><code class="prism language-html"><form action="/submit" method="post"> <label for="email">邮箱：</label> <input type="email" id="email" name="email" placeholder="请输入邮箱"><br> <label for="phone">手机号：</label> <input type="tel" id="phone" name="phone" placeholder="请输入手机号"><br> <input type="submit" value="提交"> </form> </code></pre> 在上面的例子中，<code>placeholder</code> 属性用于定义输入框的占位文本，当用户没有输入内容时，占位文本会显示在输入框内。 <h4>20-表单-单选框</h4> 单选框 <code><input type="radio"></code> 用于让用户在多个选项中选择一个。 <pre><code class="prism language-html"><form action="/submit" method="post"> <input type="radio" id="male" name="gender" value="male"> <label for="male">男</label><br> <input type="radio" id="female" name="gender" value="female"> <label for="female">女</label><br> <input type="submit" value="提交"> </form> </code></pre> 在上面的例子中，<code><input type="radio"></code> 标签定义了一个单选框，<code>name</code> 属性定义了单选框的名称，<code>value</code> 属性定义了单选框的值，<code><label></code> 标签用于定义单选框的标签文本。 <h4>21-表单-上传多个文件</h4> 文件上传表单允许用户选择并上传一个或多个文件。使用 <code><input type="file" multiple></code> 属性可以实现上传多个文件的功能。 <pre><code class="prism language-html"><form action="/upload" method="post" enctype="multipart/form-data"> <input type="file" name="files[]" multiple><br> <input type="submit" value="上传"> </form> </code></pre> 在上面的例子中，<code><input type="file" multiple></code> 标签允许用户选择多个文件进行上传，<code>name="files[]"</code> 中的 <code>[]</code> 表示这是一个文件数组，<code>enctype="multipart/form-data"</code> 属性用于指定表单数据的编码类型。 尝试一下>>> <h4>22-表单-多选框</h4> 多选框 <code><input type="checkbox"></code> 用于让用户从多个选项中选择多个。 <pre><code class="prism language-html"><form action="/submit" method="post"> <input type="checkbox" id="apple" name="fruits" value="apple"> <label for="apple">苹果</label><br> <input type="checkbox" id="banana" name="fruits" value="banana"> <label for="banana">香蕉</label><br> <input type="submit" value="提交"> </form> </code></pre> 在上面的例子中，<code><input type="checkbox"></code> 标签定义了一个多选框，<code>name</code> 属性定义了多选框的名称，<code>value</code> 属性定义了多选框的值，<code><label></code> 标签用于定义多选框的标签文本。 <h4>23-表单-下拉菜单</h4> 下拉菜单 <code><select></code> 用于让用户从预定义的选项中选择一个。 <pre><code class="prism language-html"><form action="/submit" method="post"> <label for="cars">选择一辆车：</label> <select id="cars" name="car"> <option value="volvo">沃尔沃</option> <option value="saab">萨博</option> <option value="mercedes">奔驰</option> <option value="audi">奥迪</option> </select><br> <input type="submit" value="提交"> </form> </code></pre> 在上面的例子中，<code><select></code> 标签定义了一个下拉菜单，<code>name</code> 属性定义了下拉菜单的名称，<code><option></code> 标签定义了下拉菜单的选项，<code>value</code> 属性定义了选项的值。 <h4>24-表单-文本域</h4> 文本域 <code><textarea></code> 用于让用户输入多行文本。 <pre><code class="prism language-html"><form action="/submit" method="post"> <label for="message">留言：</label><br> <textarea id="message" name="message" rows="4" cols="50"></textarea><br> <input type="submit" value="提交"> </form> </code></pre> 在上面的例子中，<code><textarea></code> 标签定义了一个文本域，<code>name</code> 属性定义了文本域的名称，<code>rows</code> 和 <code>cols</code> 属性定义了文本域的行数和列数。 <h4>25-表单-label标签</h4> <code><label></code> 标签用于定义表单元素的标签文本，增加用户体验和可访问性。 <pre><code class="prism language-html"><form action="/submit" method="post"> <label for="username">用户名：</label> <input type="text" id="username" name="username"><br> <label for="password">密码：</label> <input type="password" id="password" name="password"><br> <input type="submit" value="提交"> </form> </code></pre> 在上面的例子中，<code><label></code> 标签中的 <code>for</code> 属性与对应表单元素的 <code>id</code> 属性相对应，用于关联标签文本和表单元素，点击标签文本时会自动聚焦到对应的表单元素。 <h4>26-表单-按钮</h4> 按钮 <code><button></code> 标签用于创建可点击的按钮。 <pre><code class="prism language-html"><button type="button" onclick="alert('Hello!')">点击我</button> </code></pre> 在上面的例子中，<code><button></code> 标签定义了一个按钮，<code>type="button"</code> 属性定义了按钮的类型为普通按钮，<code>onclick</code> 属性定义了按钮点击时执行的 JavaScript 代码。 <h4>27-语义化</h4> 在 HTML 中，语义化标签有助于更好地描述页面的结构和内容，提高页面的可读性和可访问性。 <h5>无语义的布局标签</h5> 无语义的布局标签通常用于布局目的，但并没有提供任何有关内容的信息。 <ul> <li><code><div></code></li> <li><code></code></li> </ul> <h5>有语义的布局标签</h5> 有语义的布局标签提供了更具有意义的语义，用于描述页面的结构和内容。 <ul> <li><code><header></code>: 网页头部</li> <li><code><nav></code>: 导航</li> <li><code><footer></code>: 页脚</li> <li><code><aside></code>: 侧边栏</li> <li><code><section></code>: 区域</li> <li><code><article></code>: 文章</li> </ul> 这些标签有助于将页面结构和内容进行更清晰的描述，提高了页面的可读性和可访问性。 <h4>28-字体实体</h4> HTML 提供了一些字符实体来显示特殊字符，比如版权符号、注册商标等。 <pre><code class="prism language-html"><p>版权所有 © 2024</p> <p>注册商标 ®</p> <p>小于等于 ≤</p> <p>大于等于 ≥</p> </code></pre> 在上面的例子中，<code>©</code> 表示版权符号，<code>®</code> 表示注册商标，<code>≤</code> 表示小于等于，<code>≥</code> 表示大于等于。这些字符实体可以在网页中显示特殊字符，增强页面的表现力。 <h4>29-图像标签</h4> 图像标签 <code><img></code> 用于在网页中嵌入图像。 <h5>图像属性</h5> 图像标签具有一些属性，用于指定图像的来源、大小、替代文本等。 <ul> <li>src： 指定图像文件的URL。</li> <li>alt： 指定替代文本，用于在图像无法显示时显示文本描述。</li> <li>width： 指定图像的宽度。</li> <li>height： 指定图像的高度。</li> <li>title： 指定标题文本，当鼠标悬停在图像上时显示。</li> </ul> <h5>属性语法</h5> <pre><code class="prism language-html"><img src="image.jpg" alt="替代文本" width="300" height="200" title="标题文本"> </code></pre> 在上面的例子中，<code>src</code> 属性指定了图像文件的URL，<code>alt</code> 属性指定了替代文本，<code>width</code> 和 <code>height</code> 属性指定了图像的宽度和高度，<code>title</code> 属性指定了标题文本。 <h4>30-路径</h4> 在 HTML 中，路径用于指定资源的位置，比如图像、样式表、脚本等。路径分为相对路径和绝对路径两种类型。 <h5>相对路径</h5> 相对路径指的是相对于当前文档的路径。它可以是相对于当前文档所在目录的路径，也可以是相对于当前文档的 URL 的路径。 <ul> <li>相对于当前文档所在目录的路径： 在链接资源时，可以直接指定资源的文件名或者相对于当前文档的子目录路径。</li> </ul> <pre><code class="prism language-html"><img src="images/picture.jpg" alt="图片"> <link rel="stylesheet" href="styles/style.css"> <script src="scripts/script.js"></script> </code></pre> 在上面的例子中，<code>src</code> 属性中的路径 <code>images/picture.jpg</code> 表示当前文档所在目录下的 <code>images</code> 目录中的 <code>picture.jpg</code> 图片文件。 <ul> <li>相对于当前文档的 URL 的路径： 如果资源位于当前文档的 URL 所在的服务器上，可以使用相对 URL 路径。</li> </ul> <pre><code class="prism language-html"><a href="../about.html">关于我们</a> </code></pre> 在上面的例子中，<code>href</code> 属性中的路径 <code>../about.html</code> 表示当前文档的上一级目录中的 <code>about.html</code> 文件。 <h5>绝对路径</h5> 绝对路径指的是资源在文件系统或者网络上的完整路径。它可以是服务器上的路径，也可以是外部资源的 URL。 <pre><code class="prism language-html"><img src="https://example.com/images/picture.jpg" alt="图片"> <link rel="stylesheet" href="https://example.com/styles/style.css"> <script src="https://example.com/scripts/script.js"></script> </code></pre> 在上面的例子中，<code>src</code> 属性中的路径 <code>https://example.com/images/picture.jpg</code> 表示一个外部网站上的图片文件的完整URL。 尝试一下>>> </div> </div> </div> </div> </div>  <div id="SOHUCS" sid="1759660317144608768"></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基础,html,前端)</h4> <div id="paradigm-article-related"> <div class="recommend-post mb30"> <ul class="widget-links"> <li><a href="/article/1891083574577262592.htm" title="Flux架构及Redux实践" target="_blank">Flux架构及Redux实践</a> GbkMobile <a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a> <div>随着前端应用的复杂性不断增加，有效管理应用状态和数据流变得至关重要。Flux架构及其最流行的实现之一Redux，为前端开发人员提供了一种可靠且可扩展的解决方案。本文将深入浅出地介绍Flux架构的核心概念，并通过实际的Redux实践示例来帮助读者更好地理解和应用这些概念。什么是Flux架构？Flux是一种前端应用架构模式，旨在解决传统MVC（Model-View-Controller）模式在大型应用</div> </li> <li><a href="/article/1891078912692252672.htm" title="Flux架构：构建可预测的Web应用状态管理体系" target="_blank">Flux架构：构建可预测的Web应用状态管理体系</a> 阿珊和她的猫 <a class="tag" taget="_blank" href="/search/%E6%9E%B6%E6%9E%84/1.htm">架构</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>前端开发工程师、技术日更博主、已过CET6阿珊和她的猫_CSDN博客专家、23年度博客之星前端领域TOP1牛客高级专题作者、打造专栏《前端面试必备》、《2024面试高频手撕题》蓝桥云课签约作者、上架课程《Vue.js和Egg.js开发企业级健康管理项目》、《带你从入门到实战全面掌握uni-app》前些天发现了一个巨牛的人工智能学习网站，通俗易懂，风趣幽默，忍不住分享一下给大家。点击跳转到网站。文章</div> </li> <li><a href="/article/1891069455673389056.htm" title="利用Python进行数据清洗与预处理：Pandas的高级用法" target="_blank">利用Python进行数据清洗与预处理：Pandas的高级用法</a> 步入烟尘 <a class="tag" taget="_blank" href="/search/python/1.htm">python</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E5%BA%93/1.htm">数据库</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>本文已收录于《Python超入门指南全册》本专栏专门针对零基础和需要进阶提升的同学所准备的一套完整教学，从基础到精通不断进阶深入，后续还有实战项目，轻松应对面试，专栏订阅地址：https://blog.csdn.net/mrdeam/category_12647587.html优点：订阅限时19.9付费专栏，私信博主还可进入全栈VIP答疑群，作者优先解答机会（代码指导、远程服务），群里大佬众多可以</div> </li> <li><a href="/article/1891064917126082560.htm" title="Mac配置环境变量时终端显示bash-3.2解决方案" target="_blank">Mac配置环境变量时终端显示bash-3.2解决方案</a> dearbaba_11 <a class="tag" taget="_blank" href="/search/%5CN/1.htm">\N</a> <div>Mac配置环境变量时终端显示bash-3.2解决方案参考文章：（1）Mac配置环境变量时终端显示bash-3.2解决方案（2）https://www.cnblogs.com/jasmine0112/p/12285114.html备忘一下。</div> </li> <li><a href="/article/1891054457932804096.htm" title="[失业前端恶补算法]JavaScript leetcode刷题top100（六）：字母异位词分组、最长连续序列、找到字符串中所有字母异位词、最大子数组和、除自身以外数组的乘积" target="_blank">[失业前端恶补算法]JavaScript leetcode刷题top100（六）：字母异位词分组、最长连续序列、找到字符串中所有字母异位词、最大子数组和、除自身以外数组的乘积</a> 摸鱼老萌新 <a class="tag" taget="_blank" href="/search/%E5%A4%B1%E4%B8%9A%E5%89%8D%E7%AB%AF%E6%81%B6%E8%A1%A5%E7%AE%97%E6%B3%95/1.htm">失业前端恶补算法</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%8A%A8%E6%80%81%E8%A7%84%E5%88%92/1.htm">动态规划</a><a class="tag" taget="_blank" href="/search/%E7%AE%97%E6%B3%95/1.htm">算法</a><a class="tag" taget="_blank" href="/search/%E5%93%88%E5%B8%8C/1.htm">哈希</a> <div>专栏声明：只求用最简单的，容易理解的方法通过，不求优化，不喜勿喷49.字母异位词分组题面给你一个字符串数组，请你将字母异位词组合在一起。可以按任意顺序返回结果列表。字母异位词是由重新排列源单词的所有字母得到的一个新单词。知识点：哈希表、排序思路这里用了js语言的一个小技巧，我们可以使用split这个api将字符串变成字符的数组，之后我们对得到的数组进行排序，这样字母异位词得到了结果字符串的一致的，</div> </li> <li><a href="/article/1891053702341521408.htm" title="Java面试八股文：Memcached面试题专场（持续更新中......）" target="_blank">Java面试八股文：Memcached面试题专场（持续更新中......）</a> Java凤梨 <a class="tag" taget="_blank" href="/search/Java%E9%87%91%E4%B8%89%E9%93%B6%E5%9B%9B%E9%9D%A2%E8%AF%95%E9%A2%98/1.htm">Java金三银四面试题</a><a class="tag" taget="_blank" href="/search/memcached/1.htm">memcached</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a> <div>全套Java金三银四面试题持续更新可文末自取，建议关注收藏不然下次找不到哟~目录1、Memcached是什么，有什么作用？memcached服务在企业集群架构中有哪些应用场景？一、作为数据库的前端缓存应用二、作业集群的session会话共享存储。2、Memcached服务分布式集群如何实现？3、Memcached服务特点及工作原理是什么？4、简述Memcached内存管理机制原理？SlabAllo</div> </li> <li><a href="/article/1891053069785952256.htm" title="高可用（HA）架构" target="_blank">高可用（HA）架构</a> weixin_34344403 <a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a><a class="tag" taget="_blank" href="/search/%E7%B3%BB%E7%BB%9F%E6%9E%B6%E6%9E%84/1.htm">系统架构</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>http://aokunsang.iteye.com/blog/2053719浅谈web应用的负载均衡、集群、高可用(HA)解决方案http://zhuanlan.51cto.com/art/201612/524201.htm互联网架构“高可用”http://www.blogjava.net/ivanwan/archive/2013/12/25/408014.htmlLVS/Nginx/HAPro</div> </li> <li><a href="/article/1891048274958282752.htm" title="WEB漏洞-XXE&XML之利用检测绕过" target="_blank">WEB漏洞-XXE&XML之利用检测绕过</a> 网小白白 <a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/php/1.htm">php</a><a class="tag" taget="_blank" href="/search/web/1.htm">web</a><a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C%E5%AE%89%E5%85%A8/1.htm">网络安全</a> <div>XXE"xmlexternalentityinjection"-XML外部实体注入漏洞服务端接收和解析了来自用户端的xml数据,而又没有做严格的安全控制,从而导致xml外部实体注入xml基本语法XML被设计用来结构化、存储以及传输信息;恰恰相反,HTML是被设计用来显示数据，其焦点是数据的外观。XML没有预定义的标签。它仅仅是纯文本而已。有能力处理纯文本的软件都可以处理XML。XML不会做任何事情</div> </li> <li><a href="/article/1891046889193795584.htm" title="计算机编程中的抽象语法树（AST）在代码分析和转换中的应用与优化" target="_blank">计算机编程中的抽象语法树（AST）在代码分析和转换中的应用与优化</a> 借口 <a class="tag" taget="_blank" href="/search/%E7%83%AD%E7%82%B9%E8%B5%84%E8%AE%AF/1.htm">热点资讯</a> <div>博客主页：借口的CSDN主页⏩文章专栏：《热点资讯》计算机编程中的抽象语法树（AST）在代码分析和转换中的应用与优化计算机编程中的抽象语法树（AST）在代码分析和转换中的应用与优化计算机编程中的抽象语法树（AST）在代码分析和转换中的应用与优化引言抽象语法树概述定义历史背景核心特性简化复杂度提供统一接口支持多种操作应用场景编译器前端静态代码分析自动化测试框架源码美化工具成功案例分析ESLintRo</div> </li> <li><a href="/article/1891045123052072960.htm" title="Git commit type 规范" target="_blank">Git commit type 规范</a> 老衲呢 <a class="tag" taget="_blank" href="/search/Git/1.htm">Git</a><a class="tag" taget="_blank" href="/search/git/1.htm">git</a> <div>gitcommit提交规范提交规范：gitcommit-m“feat(新增暂停功能):新增执行推广任务暂停功能”详情请参考：阮雪峰的Commitmessage规范(点击可转跳)(https://www.ruanyifeng.com/blog/2016/01/commit_message_change_log.html)#主要typefeat:增加新功能fix:修复bug#特殊typedocs:只改</div> </li> <li><a href="/article/1891028858396798976.htm" title="前端实现电子签名" target="_blank">前端实现电子签名</a> 一个00后前端开发 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div> Document *{ margin:0; padding:0; } 取消保存 constcanvas=document.querySelector('canvas'); canvas.width=500; canvas</div> </li> <li><a href="/article/1891024191801585664.htm" title="pptx文档提取信息" target="_blank">pptx文档提取信息</a> DreamBoy_W.W.Y <a class="tag" taget="_blank" href="/search/%E7%9F%A5%E8%AF%86%E5%9B%BE%E8%B0%B1/1.htm">知识图谱</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>目录一、前言二、python-pptx提取核心代码三、LibreOffice转换pdf再提取的核心代码一、前言pptx文档提取解析常用的库。如果只需要解析.pptx的文本、表格、图片，推荐使用python-pptx（开源，轻量级）。如果需要高性能、支持.ppt、动画、格式转换，推荐Aspose.Slides（收费）。如果需要PPTX转PDF或者HTML，适用于Linux服务器，推荐LibreOff</div> </li> <li><a href="/article/1891021921319972864.htm" title="深入理解现代前端框架：Vue.js 的进阶探秘" target="_blank">深入理解现代前端框架：Vue.js 的进阶探秘</a> lozhyf <a class="tag" taget="_blank" href="/search/%E5%B7%A5%E4%BD%9C/1.htm">工作</a><a class="tag" taget="_blank" href="/search/%E9%9D%A2%E8%AF%95/1.htm">面试</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/flutter/1.htm">flutter</a> <div>在当今的web开发领域，前端框架如雨后春笋般涌现，而Vue.js凭借其简洁易用和强大的功能，成为了众多开发者的心头好。本文将带领大家深入探索Vue.js的一些进阶特性，帮助你将Vue应用开发提升到新的高度。一、Vue.js的响应式原理Vue.js最核心的特性之一就是其响应式系统。当数据发生变化时，Vue能够自动更新DOM，这一过程是如何实现的呢？Vue.js使用了Object.defineProp</div> </li> <li><a href="/article/1891014354728448000.htm" title="深入思考：技术生态的繁荣与开发者的选择" target="_blank">深入思考：技术生态的繁荣与开发者的选择</a> 艾米栗写代码 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>作为一名前端开发者，我们是一直被两类问题困惑着的：1、技术生态中“轮子迭代”与“原理理解”的矛盾，2、业务开发与技术深度的平衡问题。这些问题本质上是开发者在不同阶段必然面临的挑战。我们可以从以下几个角度进一步探讨：一、为什么“轮子”永远在迭代？1.技术演进的必然性场景细化：早期工具（如Grunt、Gulp）解决的是通用构建问题，但随着前端复杂度提升，出现了更垂直的解决方案（如Vite专攻开发体验、</div> </li> <li><a href="/article/1891014227565539328.htm" title="对前端的技术进行分层" target="_blank">对前端的技术进行分层</a> 艾米栗写代码 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>前端相比较后端而言，由于其发展历史和浏览器的标准不一，导致其看上去简单，但是深入起来又很复杂，在最开始学习的时候，我们往往是了解一下三剑客和vue、react的api就开始上手工作了，但是到后面会发现，每一步就像缺了一根拐杖，而这根拐杖指的就是对前端整个层面的了解。只有我们建立了对整个层面的了解，才能到我们遇到的问题进行分类，才能在遇到困难的时候，能够分门别类的去解决问题。前端技术的分层可以类比为</div> </li> <li><a href="/article/1891013470736936960.htm" title="Linux安装Anaconda、Miniconda" target="_blank">Linux安装Anaconda、Miniconda</a> 让我安静会 <a class="tag" taget="_blank" href="/search/%E9%85%8D%E7%BD%AE%E4%B8%8E%E5%AE%89%E8%A3%85/1.htm">配置与安装</a><a class="tag" taget="_blank" href="/search/linux/1.htm">linux</a><a class="tag" taget="_blank" href="/search/%E8%BF%90%E7%BB%B4/1.htm">运维</a><a class="tag" taget="_blank" href="/search/%E6%9C%8D%E5%8A%A1%E5%99%A8/1.htm">服务器</a> <div>Anaconda下载：https://repo.anaconda.com/archive/MinicondaDocument：https://docs.conda.io/projects/miniconda/en/latest/index.html进入Linux系统，到/data/file/文件夹下，直接将anaconda下载到该文件夹中：wgethttps://repo.anaconda.com</div> </li> <li><a href="/article/1891002003375583232.htm" title="vue3 ref/reactive 修改数组的方法" target="_blank">vue3 ref/reactive 修改数组的方法</a> 取啥好 <a class="tag" taget="_blank" href="/search/vue/1.htm">vue</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</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> <div>import{ref}from'vue'//给每个todo对象一个唯一的idletid=0constnewTodo=ref('')consttodos=ref([{id:id++,text:'LearnHTML'},{id:id++,text:'LearnJavaScript'},{id:id++,text:'LearnVue'}])functionaddTodo(){todos.value.pu</div> </li> <li><a href="/article/1891001877055729664.htm" title="一文讲清前端热更新" target="_blank">一文讲清前端热更新</a> 艾米栗写代码 <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>引言前端开发中，“保存代码后页面自动刷新”早已成为开发者的标配体验。但你是否思考过，为什么某些场景下修改代码后页面无需完全刷新，甚至能保留当前状态（如表单输入、滚动位置）？这背后的核心机制就是热更新（HotModuleReplacement,HMR）。本文将从现象出发，逐步拆解其实现原理，并揭示其中涉及的关键技术。一、热更新的“现象”：开发者眼中的魔法假设你正在开发一个React应用：修改CSS文</div> </li> <li><a href="/article/1891000740210601984.htm" title="【VUE】前端工程化与前端工程化与webpack" target="_blank">【VUE】前端工程化与前端工程化与webpack</a> boy快快长大 <a class="tag" taget="_blank" href="/search/VUE/1.htm">VUE</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</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> <div>前端工程化与webpack1.前端工程化2.webpack的基本使用2.1创建列表隔行变色项目1.前端工程化2.webpack的基本使用2.1创建列表隔行变色项目初始化项目①新建项目空白目录，并运行npminit–y命令，初始化包管理配置文件package.json②新建src源代码目录③新建src->index.html首页和src->index.js脚本文件④初始化首页基本的结构⑤运行npmi</div> </li> <li><a href="/article/1890998346647138304.htm" title="AI：236-基于RCS-OSA的YOLOv8改进 | 增强空间对象注意力实现小物体检测精度提升" target="_blank">AI：236-基于RCS-OSA的YOLOv8改进 | 增强空间对象注意力实现小物体检测精度提升</a> 一键难忘 <a class="tag" taget="_blank" href="/search/%E7%B2%BE%E9%80%9AAI%E5%AE%9E%E6%88%98%E5%8D%83%E4%BE%8B%E4%B8%93%E6%A0%8F%E5%90%88%E9%9B%86/1.htm">精通AI实战千例专栏合集</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/YOLO/1.htm">YOLO</a><a class="tag" taget="_blank" href="/search/%E7%9B%AE%E6%A0%87%E8%B7%9F%E8%B8%AA/1.htm">目标跟踪</a><a class="tag" taget="_blank" href="/search/RCS-OSA/1.htm">RCS-OSA</a> <div>本文收录于专栏：精通AI实战千例专栏合集https://blog.csdn.net/weixin_52908342/category_11863492.html从基础到实践，深入学习。无论你是初学者还是经验丰富的老手，对于本专栏案例和项目实践都有参考学习意义。每一个案例都附带关键代码，详细讲解供大家学习，希望可以帮到大家。正在不断更新中~文章目录1.通过RCS-OSA替换C2f实现暴力涨点2.理论</div> </li> <li><a href="/article/1890991157433921536.htm" title="从零开始：如何用 Vue 3 和 Vite 创建现代前端项目" target="_blank">从零开始：如何用 Vue 3 和 Vite 创建现代前端项目</a> 全栈探索者chen <a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/vue.js/1.htm">vue.js</a><a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF%E6%A1%86%E6%9E%B6/1.htm">前端框架</a><a class="tag" taget="_blank" href="/search/ecmascript/1.htm">ecmascript</a><a class="tag" taget="_blank" href="/search/vite/1.htm">vite</a> <div>从零开始：如何用Vue3和Vite创建现代前端项目前言随着现代前端框架的快速发展，开发工具和构建工具也在不断进化。Vue3是目前流行的前端框架之一，凭借其轻量、易用和高效的特性，广泛应用于各种web应用中。而Vite则是一个现代化的构建工具，它通过引入原生ES模块支持和极快的开发模式，成为前端开发的新宠。本文将介绍如何使用Vue3和Vite从零开始搭建一个前端项目，并展示一些常见的项目配置和优化技</div> </li> <li><a href="/article/1890987756713209856.htm" title=".NET 9.0 的 Blazor Web App 项目，进度条＜progress＞组件使用注意事项" target="_blank">.NET 9.0 的 Blazor Web App 项目，进度条＜progress＞组件使用注意事项</a> cqths <a class="tag" taget="_blank" href="/search/Blazor/1.htm">Blazor</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/App/1.htm">App</a><a class="tag" taget="_blank" href="/search/Blazor/1.htm">Blazor</a><a class="tag" taget="_blank" href="/search/web/1.htm">web</a><a class="tag" taget="_blank" href="/search/app/1.htm">app</a><a class="tag" taget="_blank" href="/search/.net/1.htm">.net</a><a class="tag" taget="_blank" href="/search/c%23/1.htm">c#</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>一、执行过程中，要刷新进度条的显示，需要延时、释放，否则进度条不实时更新，最后一下到100%//延时，释放给前端：【必须】，否则进度条不实时更新，最后一下到100awaitTask.Delay(1);二、执行过程中，需要通知Blazor更新UI，否则不实时更新//通知Blazor更新UI：【必须】，否则不实时更新StateHasChanged();三、如果是单击执行，执行过程中，应该禁用按钮，防止</div> </li> <li><a href="/article/1890985363690811392.htm" title="JavaScript网页设计案例：动态天气预报页面" target="_blank">JavaScript网页设计案例：动态天气预报页面</a> 静默.\\ <a class="tag" taget="_blank" href="/search/javascript/1.htm">javascript</a><a class="tag" taget="_blank" href="/search/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>在这个案例中，我们将创建一个简单的网页，该网页能够根据用户输入的城市名称显示当前的天气情况。这个项目不仅将帮助我们理解如何使用JavaScript进行DOM操作和事件处理，还将介绍如何通过API获取实时数据。1.准备工作首先，你需要注册一个免费的天气API服务（如OpenWeatherMap），以获取API密钥。这将允许你访问其服务器上的天气数据。2.HTML结构让我们从基本的HTML结构开始：D</div> </li> <li><a href="/article/1890976411477405696.htm" title="后端学习前端-html+css" target="_blank">后端学习前端-html+css</a> 想要变瘦的小码头 <a class="tag" taget="_blank" href="/search/%E5%90%8E%E7%AB%AF%E5%AD%A6%E5%89%8D%E7%AB%AF/1.htm">后端学前端</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%AD%A6%E4%B9%A0/1.htm">学习</a><a class="tag" taget="_blank" href="/search/html/1.htm">html</a> <div>第一章.HTML与CSSHTML是什么：即HyperTextMarkuplanguage超文本标记语言，咱们熟知的网页就是用它编写的，HTML的作用是定义网页的内容和结构。HyperText是指用超链接的方式组织网页，把网页联系起来Markup是指用的方式赋予内容不同的功能和含义CSS是什么：即CascadingStyleSheets级联（层叠）样式表，它描述了网页的表现与展示效果1.HTML元素</div> </li> <li><a href="/article/1890973886107938816.htm" title="Java面试突击3(3)：Java基础面试--JVM" target="_blank">Java面试突击3(3)：Java基础面试--JVM</a> CodingALife <a class="tag" taget="_blank" href="/search/%E7%A4%BE%E6%8B%9B%E9%9D%A2%E7%BB%8F/1.htm">社招面经</a><a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>1、JVM有哪⼏块内存区域？Java8之后对内存分代做什么改进？Version:0.9StartHTML:0000000105EndHTML:0000003884StartFragment:0000000141EndFragment:0000003844集合、并发、spring框架，期待着我对这些基础的东西做⼀些很深⼊的，很⽜X的讲解，基于框架写⼀些代码，完事⼉了之后，就会把代码进⾏⼀个部署，⼀般</div> </li> <li><a href="/article/1890973886674169856.htm" title="js：highlight.js实现代码的语法高亮" target="_blank">js：highlight.js实现代码的语法高亮</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/%E5%BC%80%E5%8F%91%E8%AF%AD%E8%A8%80/1.htm">开发语言</a> <div>highlight.jsSyntaxhighlightingfortheWeb译文：highlight.js为Web突出显示语法文档官网：https://highlightjs.org/文档：https://highlightjs.readthedocs.io/en/latest/index.htmlgithub:https://github.com/highlightjs/highlight.j</div> </li> <li><a href="/article/1890965177625538560.htm" title="Vue.js 配置 Babel、Webpack 和 ESLint" target="_blank">Vue.js 配置 Babel、Webpack 和 ESLint</a> 轻口味 <a class="tag" taget="_blank" href="/search/VUE.JS/1.htm">VUE.JS</a><a class="tag" taget="_blank" href="/search/%E5%85%A5%E9%97%A8%E4%B8%8E%E5%AE%9E%E8%B7%B5/1.htm">入门与实践</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/%E5%89%8D%E7%AB%AF/1.htm">前端</a> <div>Vue.js配置Babel、Webpack和ESLint今天我们来聊聊如何配置Babel、Webpack和ESLint，这三个工具在现代前端开发中扮演着重要角色。它们分别负责代码转译、模块打包和代码质量检测，合理配置它们能大大提高项目的开发效率和质量。下面我将详细介绍它们的作用，并提供具体的配置示例。1.Babel配置Babel主要用于将现代JavaScript（ES6+）代码转译为兼容性更好的版</div> </li> <li><a href="/article/1890962532856819712.htm" title="Html、Markdown的信息提取" target="_blank">Html、Markdown的信息提取</a> DreamBoy_W.W.Y <a class="tag" taget="_blank" href="/search/%E7%9F%A5%E8%AF%86%E5%9B%BE%E8%B0%B1/1.htm">知识图谱</a><a class="tag" taget="_blank" href="/search/python/1.htm">python</a> <div>目录一、前言二、核心代码1、解析提取html文档2、提取Markdown文档信息一、前言【python】mistune转换md为HTML，BeautifulSoup解析读取。【python】Html文档，使用BeautifulSoup解析读取。二、核心代码1、解析提取html文档defextract_all_content(soup):content={'text':[]</div> </li> <li><a href="/article/1890957233437601792.htm" title="CSS 核心技术知识点详解：从基础到进阶" target="_blank">CSS 核心技术知识点详解：从基础到进阶</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>本文基于图中提供的17个CSS核心知识点展开讲解，涵盖基础概念、布局原理、实战技巧及性能优化等内容。每个知识点均附代码示例和原理分析，帮助读者系统性掌握CSS核心能力。1.选择器作用：定位HTML元素并应用样式。常见类型：类选择器：.class-name{...}ID选择器：#id-name{...}属性选择器：[type="text"]{...}代码示例：.button{color:red;}/</div> </li> <li><a href="/article/1890952943071457280.htm" title="Deepseek与doubao|tongyi|wenxin三个大模型对比编写数据处理脚本" target="_blank">Deepseek与doubao|tongyi|wenxin三个大模型对比编写数据处理脚本</a> AI技术老狗（QA） <a class="tag" taget="_blank" href="/search/Deepseek/1.htm">Deepseek</a><a class="tag" taget="_blank" href="/search/%E5%A4%A7%E6%A8%A1%E5%9E%8B/1.htm">大模型</a><a class="tag" taget="_blank" href="/search/AI%E7%BC%96%E5%86%99%E8%84%9A%E6%9C%AC/1.htm">AI编写脚本</a> <div>‌DeepSeek在编写脚本方面的能力非常强大，尤其在编程、推理和数学计算方面展现出了超越普通AI的能力‌。DeepSeek的核心优势在于其编程能力的显著提高，能够轻松应对前端脚本和后端逻辑的编写，大大降低了程序员编写代码的难度。今天我们就对比下deepseek、豆包、通义千问、文心一言这四个进行一下对比，对比的题目为：《帮我写一个处理excel数据的python脚本，要求：100万条数据，去除重</div> </li> <li><a href="/article/26.htm" title="设计模式介绍" target="_blank">设计模式介绍</a> tntxia <a class="tag" taget="_blank" href="/search/%E8%AE%BE%E8%AE%A1%E6%A8%A1%E5%BC%8F/1.htm">设计模式</a> <div>设计模式来源于土木工程师克里斯托弗亚历山大（http://en.wikipedia.org/wiki/Christopher_Alexander）的早期作品。他经常发表一些作品，内容是总结他在解决设计问题方面的经验，以及这些知识与城市和建筑模式之间有何关联。有一天，亚历山大突然发现，重复使用这些模式可以让某些设计构造取得我们期望的最佳效果。亚历山大与萨拉-石川佳纯和穆雷西乐弗斯坦合作</div> </li> <li><a href="/article/153.htm" title="android高级组件使用(一)" target="_blank">android高级组件使用(一)</a> 百合不是茶 <a class="tag" taget="_blank" href="/search/android/1.htm">android</a><a class="tag" taget="_blank" href="/search/RatingBar/1.htm">RatingBar</a><a class="tag" taget="_blank" href="/search/Spinner/1.htm">Spinner</a> <div>1、自动完成文本框（AutoCompleteTextView） AutoCompleteTextView从EditText派生出来，实际上也是一个文本编辑框，但它比普通编辑框多一个功能：当用户输入一个字符后，自动完成文本框会显示一个下拉菜单，供用户从中选择，当用户选择某个菜单项之后，AutoCompleteTextView按用户选择自动填写该文本框。使用AutoCompleteTex</div> </li> <li><a href="/article/280.htm" title="[网络与通讯]路由器市场大有潜力可挖掘" target="_blank">[网络与通讯]路由器市场大有潜力可挖掘</a> comsci <a class="tag" taget="_blank" href="/search/%E7%BD%91%E7%BB%9C/1.htm">网络</a> <div> 如果国内的电子厂商和计算机设备厂商觉得手机市场已经有点饱和了,那么可以考虑一下交换机和路由器市场的进入问题..... 这方面的技术和知识,目前处在一个开放型的状态,有利于各类小型电子企业进入 &nbs</div> </li> <li><a href="/article/407.htm" title="自写简单Redis内存统计shell" target="_blank">自写简单Redis内存统计shell</a> 商人shang <a class="tag" taget="_blank" href="/search/Linux+shell/1.htm">Linux shell</a><a class="tag" taget="_blank" href="/search/%E7%BB%9F%E8%AE%A1Redis%E5%86%85%E5%AD%98/1.htm">统计Redis内存</a> <div>#!/bin/bash address="192.168.150.128:6666,192.168.150.128:6666" hosts=(${address//,/ }) sfile="staticts.log" for hostitem in ${hosts[@]} do ipport=(${hostitem</div> </li> <li><a href="/article/534.htm" title="单例模式(饿汉 vs懒汉)" target="_blank">单例模式(饿汉 vs懒汉)</a> oloz <a class="tag" taget="_blank" href="/search/%E5%8D%95%E4%BE%8B%E6%A8%A1%E5%BC%8F/1.htm">单例模式</a> <div>package 单例模式; /* * 应用场景:保证在整个应用之中某个对象的实例只有一个 * 单例模式种的《懒汉模式》 * */ public class Singleton { //01 将构造方法私有化，外界就无法用new Singleton()的方式获得实例 private Singleton(){}; //02 申明类得唯一实例 priva</div> </li> <li><a href="/article/661.htm" title="springMvc json支持" target="_blank">springMvc json支持</a> 杨白白 <a class="tag" taget="_blank" href="/search/json+springmvc/1.htm">json springmvc</a> <div>1.Spring mvc处理json需要使用jackson的类库，因此需要先引入jackson包 2在spring mvc中解析输入为json格式的数据:使用@RequestBody来设置输入 @RequestMapping("helloJson") public @ResponseBody JsonTest helloJson() { </div> </li> <li><a href="/article/788.htm" title="android播放，掃描添加本地音頻文件" target="_blank">android播放，掃描添加本地音頻文件</a> 小桔子 <div> 最近幾乎沒有什麽事情，繼續鼓搗我的小東西。想在項目中加入一個簡易的音樂播放器功能，就像華為p6桌面上那麼大小的音樂播放器。用過天天動聽或者QQ音樂播放器的人都知道，可已通過本地掃描添加歌曲。不知道他們是怎麼實現的，我覺得應該掃描設備上的所有文件，過濾出音頻文件，每個文件實例化為一個實體，記錄文件名、路徑、歌手、類型、大小等信息。具體算法思想，</div> </li> <li><a href="/article/915.htm" title="oracle常用命令" target="_blank">oracle常用命令</a> aichenglong <a class="tag" taget="_blank" href="/search/oracle/1.htm">oracle</a><a class="tag" taget="_blank" href="/search/dba/1.htm">dba</a><a class="tag" taget="_blank" href="/search/%E5%B8%B8%E7%94%A8%E5%91%BD%E4%BB%A4/1.htm">常用命令</a> <div>1 创建临时表空间 create temporary tablespace user_temp tempfile 'D:\oracle\oradata\Oracle9i\user_temp.dbf' size 50m autoextend on next 50m maxsize 20480m extent management local</div> </li> <li><a href="/article/1042.htm" title="25个Eclipse插件" target="_blank">25个Eclipse插件</a> AILIKES <a class="tag" taget="_blank" href="/search/eclipse%E6%8F%92%E4%BB%B6/1.htm">eclipse插件</a> <div>提高代码质量的插件1. FindBugsFindBugs可以帮你找到Java代码中的bug，它使用Lesser GNU Public License的自由软件许可。2. CheckstyleCheckstyle插件可以集成到Eclipse IDE中去，能确保Java代码遵循标准代码样式。3. ECLemmaECLemma是一款拥有Eclipse Public License许可的免费工具，它提供了</div> </li> <li><a href="/article/1169.htm" title="Spring MVC拦截器+注解方式实现防止表单重复提交" target="_blank">Spring MVC拦截器+注解方式实现防止表单重复提交</a> baalwolf <a class="tag" taget="_blank" href="/search/spring+mvc/1.htm">spring mvc</a> <div>原理：在新建页面中Session保存token随机码，当保存时验证，通过后删除，当再次点击保存时由于服务器端的Session中已经不存在了，所有无法验证通过。 1.新建注解： ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 </div> </li> <li><a href="/article/1296.htm" title="《Javascript高级程序设计(第3版)》闭包理解" target="_blank">《Javascript高级程序设计(第3版)》闭包理解</a> bijian1013 <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a> <div>“闭包是指有权访问另一个函数作用域中的变量的函数。”--《Javascript高级程序设计(第3版)》看以下代码： <script type="text/javascript"> function outer() { var i = 10; return f</div> </li> <li><a href="/article/1423.htm" title="AngularJS Module类的方法" target="_blank">AngularJS Module类的方法</a> bijian1013 <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/AngularJS/1.htm">AngularJS</a><a class="tag" taget="_blank" href="/search/Module/1.htm">Module</a> <div> AngularJS中的Module类负责定义应用如何启动，它还可以通过声明的方式定义应用中的各个片段。我们来看看它是如何实现这些功能的。一.Main方法在哪里如果你是从Java或者Python编程语言转过来的，那么你可能很想知道AngularJS里面的main方法在哪里？这个把所</div> </li> <li><a href="/article/1550.htm" title="[Maven学习笔记七]Maven插件和目标" target="_blank">[Maven学习笔记七]Maven插件和目标</a> bit1129 <a class="tag" taget="_blank" href="/search/maven%E6%8F%92%E4%BB%B6/1.htm">maven插件</a> <div>插件(plugin)和目标(goal) Maven，就其本质而言，是一个插件执行框架，Maven的每个目标的执行逻辑都是由插件来完成的，一个插件可以有1个或者几个目标，比如maven-compiler-plugin插件包含compile和testCompile，即maven-compiler-plugin提供了源代码编译和测试源代码编译的两个目标使用插件和目标使得我们可以干预</div> </li> <li><a href="/article/1677.htm" title="【Hadoop八】Yarn的资源调度策略" target="_blank">【Hadoop八】Yarn的资源调度策略</a> bit1129 <a class="tag" taget="_blank" href="/search/hadoop/1.htm">hadoop</a> <div>1. Hadoop的三种调度策略 Hadoop提供了3中作业调用的策略， FIFO Scheduler Fair Scheduler Capacity Scheduler 以上三种调度算法，在Hadoop MR1中就引入了，在Yarn中对它们进行了改进和完善.Fair和Capacity Scheduler用于多用户共享的资源调度 2. 多用户资源共享的调度 </div> </li> <li><a href="/article/1804.htm" title="Nginx使用Linux内存加速静态文件访问" target="_blank">Nginx使用Linux内存加速静态文件访问</a> ronin47 <div>Nginx是一个非常出色的静态资源web服务器。如果你嫌它还不够快，可以把放在磁盘中的文件，映射到内存中，减少高并发下的磁盘IO。先做几个假设。nginx.conf中所配置站点的路径是/home/wwwroot/res，站点所对应文件原始存储路径：/opt/web/res shell脚本非常简单，思路就是拷贝资源文件到内存中，然后在把网站的静态文件链接指向到内存中即可。具体如下： </div> </li> <li><a href="/article/1931.htm" title="关于Unity3D中的Shader的知识" target="_blank">关于Unity3D中的Shader的知识</a> brotherlamp <a class="tag" taget="_blank" href="/search/unity/1.htm">unity</a><a class="tag" taget="_blank" href="/search/unity%E8%B5%84%E6%96%99/1.htm">unity资料</a><a class="tag" taget="_blank" href="/search/unity%E6%95%99%E7%A8%8B/1.htm">unity教程</a><a class="tag" taget="_blank" href="/search/unity%E8%A7%86%E9%A2%91/1.htm">unity视频</a><a class="tag" taget="_blank" href="/search/unity%E8%87%AA%E5%AD%A6/1.htm">unity自学</a> <div>首先先解释下Unity3D的Shader，Unity里面的Shaders是使用一种叫ShaderLab的语言编写的，它同微软的FX文件或者NVIDIA的CgFX有些类似。传统意义上的vertex shader和pixel shader还是使用标准的Cg/HLSL 编程语言编写的。因此Unity文档里面的Shader，都是指用ShaderLab编写的代码，然后我们来看下Unity3D自带的60多个S</div> </li> <li><a href="/article/2058.htm" title="CopyOnWriteArrayList vs ArrayList" target="_blank">CopyOnWriteArrayList vs ArrayList</a> bylijinnan <a class="tag" taget="_blank" href="/search/java/1.htm">java</a> <div>package com.ljn.base; import java.util.ArrayList; import java.util.Iterator; import java.util.List; import java.util.concurrent.CopyOnWriteArrayList; /** * 总述： * 1.ArrayListi不是线程安全的，CopyO</div> </li> <li><a href="/article/2185.htm" title="内存中栈和堆的区别" target="_blank">内存中栈和堆的区别</a> chicony <a class="tag" taget="_blank" href="/search/%E5%86%85%E5%AD%98/1.htm">内存</a> <div> 1、内存分配方面：堆：一般由程序员分配释放，若程序员不释放，程序结束时可能由OS回收。注意它与数据结构中的堆是两回事，分配方式是类似于链表。可能用到的关键字如下：new、malloc、delete、free等等。栈：由编译器(Compiler)自动分配释放，存放函数的参数值，局部变量的值等。其操作方式类似于数据结构中</div> </li> <li><a href="/article/2312.htm" title="回答一位网友对Scala的提问" target="_blank">回答一位网友对Scala的提问</a> chenchao051 <a class="tag" taget="_blank" href="/search/scala/1.htm">scala</a><a class="tag" taget="_blank" href="/search/map/1.htm">map</a> <div>本来准备在私信里直接回复了，但是发现不太方便，就简要回答在这里。问题写道对于scala的简洁十分佩服，但又觉得比较晦涩，例如一例，Map("a" -> List(11,111)).flatMap(_._2)，可否说下最后那个函数做了什么，真正在开发的时候也会如此简洁？谢谢先回答一点，在实际使用中，Scala毫无疑问就是这么简单。</div> </li> <li><a href="/article/2439.htm" title="mysql 取每组前几条记录" target="_blank">mysql 取每组前几条记录</a> daizj <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E7%BB%84/1.htm">分组</a><a class="tag" taget="_blank" href="/search/%E6%9C%80%E5%A4%A7%E5%80%BC/1.htm">最大值</a><a class="tag" taget="_blank" href="/search/%E6%9C%80%E5%B0%8F%E5%80%BC/1.htm">最小值</a><a class="tag" taget="_blank" href="/search/%E6%AF%8F%E7%BB%84%E4%B8%89%E6%9D%A1%E8%AE%B0%E5%BD%95/1.htm">每组三条记录</a> <div>一、对分组的记录取前N条记录：例如：取每组的前3条最大的记录 1.用子查询： SELECT * FROM tableName a WHERE 3> (SELECT COUNT(*) FROM tableName b WHERE b.id=a.id AND b.cnt>a. cnt) ORDER BY a.id,a.account DE</div> </li> <li><a href="/article/2566.htm" title="HTTP深入浅出 http请求" target="_blank">HTTP深入浅出 http请求</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/http/1.htm">http</a> <div> HTTP(HyperText Transfer Protocol)是一套计算机通过网络进行通信的规则。计算机专家设计出HTTP，使HTTP客户（如Web浏览器）能够从HTTP服务器(Web服务器)请求信息和服务，HTTP目前协议的版本是1.1.HTTP是一种无状态的协议，无状态是指Web浏览器和Web服务器之间不需要建立持久的连接，这意味着当一个客户端向服务器端发出请求，然后We</div> </li> <li><a href="/article/2693.htm" title="判断MySQL记录是否存在方法比较" target="_blank">判断MySQL记录是否存在方法比较</a> dcj3sjt126com <a class="tag" taget="_blank" href="/search/mysql/1.htm">mysql</a> <div>把数据写入到数据库的时，常常会碰到先要检测要插入的记录是否存在，然后决定是否要写入。　　我这里总结了判断记录是否存在的常用方法：　　sql语句： select count ( * ) from tablename; 　　然后读取count(*)的值判断记录是否存在。对于这种方法性能上有些浪费，我们只是想判断记录记录是否存在，没有必要全部都查出来。</div> </li> <li><a href="/article/2820.htm" title="对HTML XML的一点认识" target="_blank">对HTML XML的一点认识</a> e200702084 <a class="tag" taget="_blank" href="/search/html/1.htm">html</a><a class="tag" taget="_blank" href="/search/xml/1.htm">xml</a> <div>感谢http://www.w3school.com.cn提供的资料 HTML 文档中的每个成分都是一个节点。节点根据 DOM，HTML 文档中的每个成分都是一个节点。 DOM 是这样规定的：整个文档是一个文档节点每个 HTML 标签是一个元素节点包含在 HTML 元素中的文本是文本节点每一个 HTML 属性是一个属性节点注释属于注释节点 Node 层次 </div> </li> <li><a href="/article/2947.htm" title="jquery分页插件" target="_blank">jquery分页插件</a> genaiwei <a class="tag" taget="_blank" href="/search/jquery/1.htm">jquery</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/%E5%89%8D%E7%AB%AF/1.htm">前端</a><a class="tag" taget="_blank" href="/search/%E5%88%86%E9%A1%B5/1.htm">分页</a><a class="tag" taget="_blank" href="/search/%E6%8F%92%E4%BB%B6/1.htm">插件</a> <div>//jquery页码控件// 创建一个闭包 (function($) { // 插件的定义 $.fn.pageTool = function(options) { var totalPa</div> </li> <li><a href="/article/3201.htm" title="Mybatis与Ibatis对照入门于学习" target="_blank">Mybatis与Ibatis对照入门于学习</a> Josh_Persistence <a class="tag" taget="_blank" href="/search/mybatis/1.htm">mybatis</a><a class="tag" taget="_blank" href="/search/ibatis/1.htm">ibatis</a><a class="tag" taget="_blank" href="/search/%E5%8C%BA%E5%88%AB/1.htm">区别</a><a class="tag" taget="_blank" href="/search/%E8%81%94%E7%B3%BB/1.htm">联系</a> <div>一、为什么使用IBatis/Mybatis 对于从事 Java EE 的开发人员来说，iBatis 是一个再熟悉不过的持久层框架了，在 Hibernate、JPA 这样的一站式对象 / 关系映射（O/R Mapping）解决方案盛行之前，iBaits 基本是持久层框架的不二选择。即使在持久层框架层出不穷的今天，iBatis 凭借着易学易用、</div> </li> <li><a href="/article/3328.htm" title="C中怎样合理决定使用那种整数类型？" target="_blank">C中怎样合理决定使用那种整数类型？</a> 秋风扫落叶 <a class="tag" taget="_blank" href="/search/c/1.htm">c</a><a class="tag" taget="_blank" href="/search/%E6%95%B0%E6%8D%AE%E7%B1%BB%E5%9E%8B/1.htm">数据类型</a> <div>如果需要大数值(大于32767或小于32767), 使用long 型。否则, 如果空间很重要 (如有大数组或很多结构), 使用 short 型。除此之外, 就使用 int 型。如果严格定义的溢出特征很重要而负值无关紧要, 或者你希望在操作二进制位和字节时避免符号扩展的问题, 请使用对应的无符号类型。但是, 要注意在表达式中混用有符号和无符号值的情况。 &nbs</div> </li> <li><a href="/article/3455.htm" title="maven问题" target="_blank">maven问题</a> zhb8015 <a class="tag" taget="_blank" href="/search/maven%E9%97%AE%E9%A2%98/1.htm">maven问题</a> <div> 问题1： Eclipse 中新建maven项目无法添加src/main/java 问题 eclipse创建maevn web项目，在选择maven_archetype_web原型后，默认只有src/main/resources这个Source Floder。按照maven目录结构，添加src/main/ja</div> </li> <li><a href="/article/3582.htm" title="(二)androidpn-server tomcat版源码解析之--push消息处理" target="_blank">(二)androidpn-server tomcat版源码解析之--push消息处理</a> spjich <a class="tag" taget="_blank" href="/search/java/1.htm">java</a><a class="tag" taget="_blank" href="/search/androdipn/1.htm">androdipn</a><a class="tag" taget="_blank" href="/search/%E6%8E%A8%E9%80%81/1.htm">推送</a> <div>在 (一)androidpn-server tomcat版源码解析之--项目启动这篇中，已经描述了整个推送服务器的启动过程，并且把握到了消息的入口即XmppIoHandler这个类，今天我将继续往下分析下面的核心代码，主要分为3大块，链接创建，消息的发送，链接关闭。先贴一段XmppIoHandler的部分代码 /** * Invoked from an I/O proc</div> </li> <li><a href="/article/3709.htm" title="用js中的formData类型解决ajax提交表单时文件不能被serialize方法序列化的问题" target="_blank">用js中的formData类型解决ajax提交表单时文件不能被serialize方法序列化的问题</a> 中华好儿孙 <a class="tag" taget="_blank" href="/search/JavaScript/1.htm">JavaScript</a><a class="tag" taget="_blank" href="/search/Ajax/1.htm">Ajax</a><a class="tag" taget="_blank" href="/search/Web/1.htm">Web</a><a class="tag" taget="_blank" href="/search/%E4%B8%8A%E4%BC%A0%E6%96%87%E4%BB%B6/1.htm">上传文件</a><a class="tag" taget="_blank" href="/search/FormData/1.htm">FormData</a> <div> var formData = new FormData($("#inputFileForm")[0]); $.ajax({ type:'post', url:webRoot+"/electronicContractUrl/webapp/uploadfile", data:formData, async: false, ca</div> </li> <li><a href="/article/3836.htm" title="mybatis常用jdbcType数据类型" target="_blank">mybatis常用jdbcType数据类型</a> ysj5125094 <a class="tag" taget="_blank" href="/search/mybatis/1.htm">mybatis</a><a class="tag" taget="_blank" href="/search/mapper/1.htm">mapper</a><a class="tag" taget="_blank" href="/search/jdbcType/1.htm">jdbcType</a> <div> MyBatis 通过包含的jdbcType 类型 BIT FLOAT CHAR </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>

html标签及基础语法 大合集

01-标签语法标签结构

html标签及基础语法大合集