当前位置: 首页 > news >正文

ChatGPT对话:如何制作静态网页?

【编者按】编者在很早以前制作过静态网页,之后长期没有使用,已完全不知道最新现状了。所以,从制作工具开始询问ChatGPT,回答非常全面,完全可以解决初学者的问题。
编者虽然长期不制作网页,但一直在编程,所以最后选择了VS Code作为开发工具,并在ChatGPT的帮助下很快建立了网站框架。
在与ChatGPT对话过程中,它有些内容还不能准确理解,需要在它提供的示例代码中进行修改,但明显提高了工作效率,特别是对小白入门特别有帮助。
PS:VS Code需要手动输入HTML标签,不适合制作网页,即使安装了插件,输入标签时有智能提示,但仍然十分麻烦。如果网页很复杂,VS Code更不能胜任。


1问:制作静态网页使用什么工具比较好?

ChatGPT

制作静态网页可以使用多种工具,具体选择取决于你的需求和技术水平。以下是一些常用的工具和方法:

  1. 文本编辑器

    • VS Code:功能强大,支持各种扩展和插件。
    • Sublime Text:轻量级,高效,支持多种编程语言。
    • Atom:由GitHub开发,具有丰富的插件。
  2. 静态网站生成器

    • Jekyll:由GitHub Pages支持,适合博客和文档网站。
    • Hugo:快速的静态网站生成器,支持多种模板。
    • Gatsby:基于React,适合创建现代、动态的静态网站。
  3. 框架和库

    • Bootstrap:一个流行的前端框架,提供了丰富的预定义样式和组件。
    • Tailwind CSS:实用的CSS框架,允许你以原子类方式定制样式。
  4. 设计工具

    • Figma:在线设计工具,适合团队协作。
    • Adobe XD:适用于设计和原型制作。
  5. 版本控制系统

    • Git:用于版本控制和协作开发,推荐使用GitHub、GitLab或Bitbucket来托管代码。
  6. 托管平台

    • GitHub Pages:适合托管静态网站,直接与GitHub仓库集成。
    • Netlify:简单易用,支持持续集成和自动部署。
    • Vercel:适合Next.js和其他静态网站,提供快速的部署和预览功能。

通过这些工具,你可以高效地制作和维护静态网页,并实现良好的用户体验和性能。根据你的需求和喜好选择合适的工具,可以帮助你更好地完成项目。


2问:我记得之前有一个比较好的、常用工具Dreamweaver,你没有提到呢?该工具停止开发了吗?

ChatGPT

Adobe Dreamweaver 仍然是一个流行的网页设计和开发工具,它并没有停止开发。Dreamweaver 提供了一个集成的开发环境(IDE),适用于创建和管理网站。它的主要特点包括:

  1. 视觉设计和代码编辑:Dreamweaver 提供了所见即所得(WYSIWYG)编辑器和代码编辑器,适合初学者和专业开发者。

  2. 多设备预览:可以实时预览网站在不同设备上的效果,方便进行响应式设计。

  3. 集成开发工具:支持 HTML、CSS、JavaScript 等多种语言,并且与 Adobe Creative Cloud 其他工具(如 Photoshop、Illustrator)无缝集成。

  4. FTP 集成:内置 FTP、SFTP 和 WebDAV,方便上传和管理网站文件。

虽然 Dreamweaver 是一个强大的工具,但近年来,许多开发者开始倾向于使用更加现代化和开源的工具(如 VS Code、Sublime Text 等)来进行网页开发。原因包括:

  • 轻量级和快速:很多现代编辑器比 Dreamweaver 更轻量,启动和运行速度更快。
  • 插件生态系统:VS Code 等编辑器有丰富的插件,可以扩展其功能以适应各种开发需求。
  • 版本控制集成:现代编辑器通常集成了 Git 和其他版本控制系统,方便团队协作。

但这并不意味着 Dreamweaver 不再适用。对于那些已经习惯使用 Dreamweaver 并且需要其所见即所得功能的用户,Dreamweaver 仍然是一个很好的选择。

总结来说,Dreamweaver 仍然在开发和使用中。如果你已经熟悉 Dreamweaver 并且它满足你的需求,可以继续使用它来制作静态网页。


3问:详细描述一下如何使用VS Code制作网页?

ChatGPT

使用 VS Code 制作网页是一种高效的方式。以下是详细的步骤,帮助你从头开始使用 VS Code 创建一个简单的静态网页:

1. 安装 VS Code

  • 下载并安装 VS Code: Visual Studio Code

2. 安装必要的扩展

在 VS Code 中安装一些有用的扩展可以提升开发体验:

  • Live Server: 实时预览网页的扩展。
  • Prettier: 代码格式化工具。
  • HTML CSS Support: 提供 HTML 和 CSS 支持。

你可以在 VS Code 中按 Ctrl+Shift+X 打开扩展市场,然后搜索并安装这些扩展。

3. 创建项目文件夹

在你的计算机上创建一个新的文件夹,用于存放你的项目文件。例如,可以命名为 MyWebsite

4. 在 VS Code 中打开项目文件夹

打开 VS Code,然后选择 File > Open Folder...,导航到你创建的项目文件夹并打开它。

5. 创建基本的文件结构

在项目文件夹中创建以下文件:

  • index.html: 你的主网页文件。
  • styles.css: 你的样式文件。
  • script.js: 你的JavaScript文件(如果需要)。

你可以在 VS Code 中右键项目文件夹,在上下文菜单中选择 New File 创建这些文件。

6. 编写 HTML

index.html 文件中编写你的 HTML 代码。下面是一个简单的示例:

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>My Website</title><link rel="stylesheet" href="styles.css">
</head>
<body><h1>Welcome to My Website</h1><p>This is a simple static website created using VS Code.</p><script src="script.js"></script>
</body>
</html>

7. 编写 CSS

styles.css 文件中编写你的 CSS 代码。下面是一个简单的示例:

body {font-family: Arial, sans-serif;margin: 0;padding: 20px;background-color: #f0f0f0;
}h1 {color: #333;
}p {color: #666;
}

8. 编写 JavaScript

script.js 文件中编写你的 JavaScript 代码。下面是一个简单的示例:

console.log('Welcome to My Website');

9. 使用 Live Server 预览

安装 Live Server 扩展后,你可以右键 index.html 文件,并选择 Open with Live Server。这将启动一个本地服务器,并在浏览器中实时预览你的网页。

10. 保存和格式化代码

  • 使用 Ctrl+S 保存文件。
  • 使用 Shift+Alt+F 格式化代码(需要安装 Prettier 扩展)。

11. 进一步开发

根据需要继续添加更多的 HTML、CSS 和 JavaScript 内容。你可以创建更多的 HTML 页面并相互链接,或添加更复杂的样式和交互功能。

12. 部署网站

当你完成开发后,可以选择将网站部署到一个托管平台,如 GitHub Pages、Netlify 或 Vercel。具体的部署步骤根据平台有所不同,但一般都很简便且有详细的指南。

通过这些步骤,你可以在 VS Code 中高效地创建一个静态网页。 VS Code 提供了丰富的功能和扩展,帮助你更快更好地完成网页开发。


4问:你给的示例代码script.js完成什么功能?

ChatGPT

在你提供的示例中,script.js 文件包含以下代码:

console.log('Welcome to My Website');

这个代码的功能是在浏览器的开发者工具控制台中打印出一句话“Welcome to My Website”。这个功能非常基础,主要用于演示如何在 HTML 页面中引入 JavaScript 文件,并确保 JavaScript 文件能够正确加载和运行。

为了让 script.js 文件展示更多实际开发中的常见功能,以下是一些可以扩展的示例:

示例 1:动态改变页面内容

这个示例展示如何使用 JavaScript 动态改变页面中的内容。

document.addEventListener('DOMContentLoaded', (event) => {const heading = document.querySelector('h1');heading.textContent = 'Welcome to My Awesome Website';
});

这个代码在页面加载完成后,将 <h1> 元素的文本内容更改为“Welcome to My Awesome Website”。

示例 2:添加事件监听器

这个示例展示如何使用 JavaScript 为按钮添加点击事件。

首先,修改 index.html,添加一个按钮:

<button id="myButton">Click Me</button>

然后,更新 script.js 文件:

document.addEventListener('DOMContentLoaded', (event) => {const button = document.getElementById('myButton');button.addEventListener('click', () => {alert('Button was clicked!');});
});

这个代码在页面加载完成后,为按钮添加一个点击事件监听器,当按钮被点击时,会弹出一个提示框。

示例 3:AJAX 请求

这个示例展示如何使用 JavaScript 发起一个简单的 AJAX 请求并显示结果。

首先,修改 index.html,添加一个用于显示数据的元素:

<div id="dataContainer"></div>

然后,更新 script.js 文件:

document.addEventListener('DOMContentLoaded', (event) => {const dataContainer = document.getElementById('dataContainer');// 发起一个GET请求fetch('https://jsonplaceholder.typicode.com/posts/1').then(response => response.json()).then(data => {// 将数据添加到页面中dataContainer.textContent = `Title: ${data.title}`;}).catch(error => console.error('Error fetching data:', error));
});

这个代码在页面加载完成后,使用 fetch 发起一个 GET 请求,从 JSONPlaceholder API 获取数据,并将数据的标题显示在页面上。

这些示例展示了 JavaScript 的一些基本功能,你可以根据自己的需求进一步扩展和定制。


5问:在js中注释符是什么?

ChatGPT

在 JavaScript 中,有两种类型的注释符号:

  1. 单行注释:使用 // 开头,注释从 // 开始直到该行的末尾。
  2. 多行注释:使用 /**/ 包围,可以跨越多行。

单行注释示例

// 这是一个单行注释
let x = 5; // 这也是一个单行注释

多行注释示例

/*这是一个多行注释可以跨越多行
*/
let y = 10;/* 这也是一个多行注释 */
let z = 15;

使用注释的场景

  • 解释代码:为代码片段添加说明,帮助自己或其他开发者理解代码的目的和逻辑。
  • 调试代码:临时注释掉某些代码,以便排除问题。
  • 文档化代码:为函数、类等添加详细的描述,特别是在使用 JSDoc 等工具时,可以生成文档。

示例

// 这是一个简单的函数,返回两个数的和
function add(a, b) {return a + b; // 返回 a 和 b 的和
}/*这个函数计算一个数组中所有元素的和参数:一个数字数组返回值:数组元素的总和
*/
function sumArray(arr) {let total = 0; // 初始化总和为0for (let i = 0; i < arr.length; i++) {total += arr[i]; // 累加数组中的每一个元素}return total; // 返回总和
}

使用注释可以大大提高代码的可读性和可维护性,是良好的编程习惯之一。


6问:我需要一个科研团队介绍的网站,网页最上面相当于主菜单,包括:主页、科研项目、获奖荣誉、知识产权及联系我们,每个菜单项,不再包含子菜单项。页面中部,根据单击的菜单项显示不同内容。每次单击菜单项后,中部显示内容有变化,但上部分的主菜单显示不变。页面下部是版权申明。写一个示例代码,要求:规划好文件夹,主菜单对应的详细内容存放在对应的子文件夹下。另外需要图文并茂,示例代码中有插入图片的代码。

ChatGPT

要创建一个科研团队介绍的网站,我们可以使用 HTML、CSS 和 JavaScript 来实现。以下是一个示例代码,它展示了如何规划文件夹结构,并创建一个包含主菜单、动态内容区域和版权声明的网页。

文件夹结构

科研团队网站/
├── index.html
├── css/
│   └── styles.css
├── js/
│   └── script.js
├── images/
│   └── example.jpg
├── content/
│   ├── home.html
│   ├── projects.html
│   ├── awards.html
│   ├── patents.html
│   └── contact.html

index.html

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>科研团队介绍</title><link rel="stylesheet" href="css/styles.css">
</head>
<body><header><nav><ul><li><a href="#" onclick="loadContent('home')">主页</a></li><li><a href="#" onclick="loadContent('projects')">科研项目</a></li><li><a href="#" onclick="loadContent('awards')">获奖荣誉</a></li><li><a href="#" onclick="loadContent('patents')">知识产权</a></li><li><a href="#" onclick="loadContent('contact')">联系我们</a></li></ul></nav></header><main id="content"><!-- 动态内容将在这里加载 --></main><footer><p>版权 © 2024 科研团队. 保留所有权利。</p></footer><script src="js/script.js"></script>
</body>
</html>

css/styles.css

body {font-family: Arial, sans-serif;margin: 0;padding: 0;display: flex;flex-direction: column;min-height: 100vh;
}header {background-color: #0044cc;color: white;padding: 10px 0;
}nav ul {list-style: none;padding: 0;margin: 0;display: flex;justify-content: center;
}nav ul li {margin: 0 15px;
}nav ul li a {color: white;text-decoration: none;font-size: 18px;
}nav ul li a:hover {text-decoration: underline;
}main {flex: 1;padding: 20px;
}footer {background-color: #333;color: white;text-align: center;padding: 10px 0;
}

js/script.js

function loadContent(page) {const contentDiv = document.getElementById('content');fetch(`content/${page}.html`).then(response => response.text()).then(data => {contentDiv.innerHTML = data;}).catch(error => {contentDiv.innerHTML = '<p>加载内容时出错,请稍后再试。</p>';console.error('Error loading content:', error);});
}// 初始加载主页内容
document.addEventListener('DOMContentLoaded', () => {loadContent('home');
});

content/home.html

<h1>欢迎来到科研团队</h1>
<p>这是我们的主页。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

content/projects.html

<h1>科研项目</h1>
<p>这里介绍我们的科研项目。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

content/awards.html

<h1>获奖荣誉</h1>
<p>这里介绍我们的获奖荣誉。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

content/patents.html

<h1>知识产权</h1>
<p>这里介绍我们的知识产权。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

content/contact.html

<h1>联系我们</h1>
<p>这里介绍如何联系我们。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

images/example.jpg

请放置一个名为 example.jpg 的示例图片在 images 文件夹中。

通过上述代码和文件结构,你可以创建一个包含主菜单、动态内容加载和版权声明的静态网页。单击主菜单项时,中部的内容会根据不同的子文件夹中的文件进行更新,而主菜单和版权声明部分保持不变。


7问:上面可能没有描述清楚需求。(1)访问网站时,显示主页内容。你设计的主目录下index.html与content下的home.html应该是同一页。(2)目录结构不对,如projects.html应该存放在它专用的子文件夹下,其它想写内容网页类似。需要修改一下

ChatGPT

理解了你的需求,我会进行相应的修改。以下是更新后的文件夹结构和代码示例:

更新后的文件夹结构

科研团队网站/
├── index.html
├── css/
│   └── styles.css
├── js/
│   └── script.js
└── pages/├── home.html├── projects/│   └── index.html├── awards/│   └── index.html├── patents/│   └── index.html└── contact/└── index.html

index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>科研团队介绍</title><link rel="stylesheet" href="css/styles.css">
</head>
<body><header><nav><ul><li><a href="pages/home.html" onclick="loadContent('home')">主页</a></li><li><a href="pages/projects/index.html" onclick="loadContent('projects')">科研项目</a></li><li><a href="pages/awards/index.html" onclick="loadContent('awards')">获奖荣誉</a></li><li><a href="pages/patents/index.html" onclick="loadContent('patents')">知识产权</a></li><li><a href="pages/contact/index.html" onclick="loadContent('contact')">联系我们</a></li></ul></nav></header><main id="content"><!-- 动态内容将在这里加载 --><iframe id="contentFrame" src="pages/home.html" frameborder="0"></iframe></main><footer><p>版权 © 2024 科研团队. 保留所有权利。</p></footer><script src="js/script.js"></script>
</body>
</html>

js/script.js

function loadContent(page) {const contentFrame = document.getElementById('contentFrame');contentFrame.src = `pages/${page}/index.html`;
}

pages/home.html

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>主页 - 科研团队介绍</title>
</head>
<body><h1>欢迎来到科研团队</h1><p>这是我们的主页。</p><img src="../images/example.jpg" alt="Example Image" style="max-width: 100%;">
</body>
</html>

pages/projects/index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>科研项目 - 科研团队介绍</title>
</head>
<body><h1>科研项目</h1><p>这里介绍我们的科研项目。</p><img src="../../images/example.jpg" alt="Example Image" style="max-width: 100%;">
</body>
</html>

pages/awards/index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>获奖荣誉 - 科研团队介绍</title>
</head>
<body><h1>获奖荣誉</h1><p>这里介绍我们的获奖荣誉。</p><img src="../../images/example.jpg" alt="Example Image" style="max-width: 100%;">
</body>
</html>

pages/patents/index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>知识产权 - 科研团队介绍</title>
</head>
<body><h1>知识产权</h1><p>这里介绍我们的知识产权。</p><img src="../../images/example.jpg" alt="Example Image" style="max-width: 100%;">
</body>
</html>

pages/contact/index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>联系我们 - 科研团队介绍</title>
</head>
<body><h1>联系我们</h1><p>这里介绍如何联系我们。</p><img src="../../images/example.jpg" alt="Example Image" style="max-width: 100%;">
</body>
</html>

注意事项

  1. index.html 中的导航链接直接指向各个子文件夹中的 index.html 文件,确保了页面在加载时显示对应的内容。
  2. script.js 中的 loadContent 函数根据点击的菜单项,动态加载并更新 iframe 中的内容。
  3. 每个子文件夹中的 index.html 文件都是独立的页面,包含各自的标题、内容和图片。

通过这种方式,你可以创建一个符合需求的科研团队介绍网站,保持了主菜单不变,但可以根据菜单项加载不同的内容页面,并包含版权声明在页面底部。


8问:还需要再修改,主目录下的index.html并没有采用框架结果。单击主菜单的菜单项,如科研项目,详细的科研项目内容,并没有在主目录下的index.hmtl

ChatGPT

明白了,你希望在主目录下的 index.html 中间部分动态显示各个菜单项对应的详细内容,而不是跳转到新页面或使用 iframe。这可以通过 JavaScript 动态加载内容并替换现有的内容来实现。下面是更新后的示例代码:

更新后的文件夹结构

科研团队网站/
├── index.html
├── css/
│   └── styles.css
├── js/
│   └── script.js
└── pages/├── home.html├── projects.html├── awards.html├── patents.html└── contact.html

index.html

<!DOCTYPE html>
<html lang="zh-CN">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>科研团队介绍</title><link rel="stylesheet" href="css/styles.css">
</head>
<body><header><nav><ul><li><a href="#" onclick="loadContent('home')">主页</a></li><li><a href="#" onclick="loadContent('projects')">科研项目</a></li><li><a href="#" onclick="loadContent('awards')">获奖荣誉</a></li><li><a href="#" onclick="loadContent('patents')">知识产权</a></li><li><a href="#" onclick="loadContent('contact')">联系我们</a></li></ul></nav></header><main id="content"><!-- 动态内容将在这里加载 --></main><footer><p>版权 © 2024 科研团队. 保留所有权利。</p></footer><script src="js/script.js"></script>
</body>
</html>

js/script.js

function loadContent(page) {fetch(`pages/${page}.html`).then(response => response.text()).then(data => {document.getElementById('content').innerHTML = data;}).catch(error => {document.getElementById('content').innerHTML = '<p>加载内容时出错,请稍后再试。</p>';console.error('Error loading content:', error);});
}// 初始加载主页内容
document.addEventListener('DOMContentLoaded', () => {loadContent('home');
});

pages/home.html

<h1>欢迎来到科研团队</h1>
<p>这是我们的主页。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

pages/projects.html

<h1>科研项目</h1>
<p>这里介绍我们的科研项目。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

pages/awards.html

<h1>获奖荣誉</h1>
<p>这里介绍我们的获奖荣誉。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

pages/patents.html

<h1>知识产权</h1>
<p>这里介绍我们的知识产权。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

pages/contact.html

<h1>联系我们</h1>
<p>这里介绍如何联系我们。</p>
<img src="images/example.jpg" alt="Example Image" style="max-width: 100%;">

注意事项

  1. index.html 中的每个菜单项通过 JavaScript 的 fetch 方法动态加载对应的 pages/*.html 文件,并将内容替换到 main 标签下的 content 区域。
  2. 每个 pages/*.html 文件包含了具体的内容和图片,这些内容将根据菜单项的选择动态显示在 index.html 页面中。

这样就实现了在点击主菜单项时,动态加载并显示详细内容,符合了你的需求。


至此,只剩下一些细节与编者的想法有点出入,再与ChatGPT交流让它继续修改,意义不大了,反而将降低工作效率。人工完善后续工作更好。

相关文章:

ChatGPT对话:如何制作静态网页?

【编者按】编者在很早以前制作过静态网页&#xff0c;之后长期没有使用&#xff0c;已完全不知道最新现状了。所以&#xff0c;从制作工具开始询问ChatGPT&#xff0c;回答非常全面&#xff0c;完全可以解决初学者的问题。 编者虽然长期不制作网页&#xff0c;但一直在编程&…...

k8s(二)

五、kubernetes架构(K8S的架构也是master和node模式&#xff09; 集群里至少需要有一个master节点&#xff0c;即就是主节点。node节点可以多个。 若是多个master节点&#xff0c;worker节点和master的apiserverr进行交互时&#xff0c;就需要通过LB(load banlance&#xff09;…...

ClickHouse表引擎概述

ClickHouse表引擎概述 表引擎的功能&#xff1a; 数据的存储方式 数据的存储位置 是否可以使用索引 是否可以使用分区 是否支持数据副本 并发数据访问 ClickHouse在建表时必须指定表引擎。 表引擎主要分为四大类&#xff1a;MergeTree系列、Log系列、与其他存储/处理系…...

jenkins系列-04-jenkins参数化构建

使用maven build之前&#xff0c;先checkout 指定分支或标签&#xff1a; 拖拽调整顺序&#xff1a;shell执行在前&#xff0c;构建在后&#xff1a; gitee新建标签tag:...

Flutter框架时间线梳理

Flutter是一个开源的UI工具包&#xff0c;它用于构建高质量的原生移动应用。Flutter的版本历史如下&#xff1a; Flutter 0.1.2&#xff1a; 2018年发布&#xff0c;这是第一个正式发布的版本&#xff0c;包含了基本的框架和工具。 Flutter 1.0.0&#xff1a; 2019年发布&…...

RAG 效果提升的最后一步—— 微调LLM

如果说&#xff0c;rerank能够让RAG的效果实现百尺竿头更进一步&#xff0c;那么LLM微调应该是RAG效果提升的最后一步。 把召回的数据&#xff0c;经过粗排&#xff0c;重排序后&#xff0c;送给模型&#xff0c;由模型最后总结答案。LLM的确已经是RAG的最后一步了。 这里还是会…...

C语言 | Leetcode C语言题解之第230题二叉搜索树中第K小的元素

题目&#xff1a; 题解&#xff1a; /*** Definition for a binary tree node.* struct TreeNode {* int val;* struct TreeNode *left;* struct TreeNode *right;* };*/int search_num(struct TreeNode* root, int k, int *result, int num) {if(num k 1){retu…...

YOWOv2(yowov2)动作识别+Fastreid身份识别 详细安装与实现

首先yowov2是一款简单且实时的时空动作检测方案&#xff0c;fastreid是行人重识别&#xff08;身份识别&#xff09; yowov2介绍链接直达fastreid链接直达为时空动作检测任务设计实时框架仍然是一个挑战。YOWOv2 提出了一种新颖的实时动作检测框架&#xff0c;利用三维骨干和二…...

【微服务】Spring Cloud中如何使用Eureka

摘要 Eureka作为Netflix开源的服务发现框架&#xff0c;在Spring Cloud体系中扮演着至关重要的角色。本文详细介绍了Eureka的基本概念、工作原理以及如何在Spring Cloud中集成和使用Eureka进行服务发现和管理。通过深入分析Eureka的注册与发现机制、区域感知和自我保护等高级特…...

【Neo4j】实战 (数据库技术丛书)学习笔记

Neo4j实战 (数据库技术丛书) 第1章演示了应用Neo4j作为图形数据库对改进性能和扩展性的可能性, 也讨论了对图形建模的数据如何正好适应于Neo4j数据模型,现在到了该动 手实践的时间了。第一章 概述 Neo4j将数据作为顶点和边存储(或者用Neo4j术语,节点和关系存 储)。用户被定…...

【Perl】Perl 语言入门

1. Perl语言介绍 Perl 是一种高级、解释型、动态编程语言&#xff0c;由Larry Wall在1987年发布。Perl 以其强大的文本处理能力而闻名&#xff0c;特别是在处理报告生成、文件转换、系统管理任务等方面。它吸收了C、Shell脚本语言、AWK、sed等语言的特性&#xff0c;并加入了大…...

godis源码分析——database存储核心1

前言 redis的核心是数据的快速存储&#xff0c;下面就来分析一下godis的底层存储是如何实现&#xff0c;先分析单机服务。 此文采用抓大放小原则&#xff0c;先大的流程方向&#xff0c;再抓细节。 流程图 源码分析 现在以客户端连接&#xff0c;并发起set key val命令为例…...

【UE5.1】Chaos物理系统基础——06 子弹破坏石块

前言 在前面我们已经完成了场系统的制作&#xff08;【UE5.1】Chaos物理系统基础——02 场系统的应用_ue5&#xff09;以及子弹的制作&#xff08;【UE5.1 角色练习】16-枪械射击——瞄准&#xff09;&#xff0c;现在我们准备实现的效果是&#xff0c;角色发射子弹来破坏石柱。…...

Django是干什么的?好用么?

Django是一个开源的Python Web框架&#xff0c;用于快速开发高质量的Web应用程序。它提供了许多功能和工具&#xff0c;以简化常见的Web开发任务&#xff0c;如路由、请求处理、数据库管理等。 Django的优点包括&#xff1a; 简单易用&#xff1a;Django提供了清晰的文档和丰…...

C语言实现数据结构B树

B树&#xff08;B-Tree&#xff09;是一种自平衡的树数据结构&#xff0c;它维护着数据的有序性&#xff0c;并允许搜索、顺序访问、插入、删除等操作都在对数时间内完成。B树广泛用于数据库和操作系统的文件系统中。 B树的基本特性 根节点&#xff1a;根节点至少有两个子节点…...

[论文阅读]MaIL: Improving Imitation Learning with Mamba

Abstract 这项工作介绍了mamba模仿学习&#xff08;mail&#xff09;&#xff0c;这是一种新颖的模仿学习&#xff08;il&#xff09;架构&#xff0c;为最先进的&#xff08;sota&#xff09;变换器策略提供了一种计算高效的替代方案。基于变压器的策略由于能够处理具有固有非…...

在HTML中使用JavaScript

在 HTML 中使用 JavaScript 有以下几种常见的方式&#xff1a; 一、内联脚本 &#xff08;一&#xff09;基本语法 内联脚本是将 JavaScript 代码直接嵌入到 HTML 文件的 <script> 标签内部。 <!DOCTYPE html> <html lang"en"> <head> <…...

InjectFix 热更新解决方案

简介 今天来谈一谈&#xff0c;项目种的客户端热更新解决方案。InjectFix是腾讯xlua团队出品的一种用于Unity中C#代码热更新热修复的解决方案。支持Unity全系列&#xff0c;全平台。与xlua的思路类似&#xff0c;InjectFix解决的痛点主要在于Unity中C#代码写的逻辑在发包之后无…...

PHP7.4安装使用rabbitMQ教程(windows)

&#xff08;1&#xff09;&#xff0c;安装rabbitMQ客户端erlang语言 一&#xff0c;erlang语言安装 下载地址1—— 下载地址2——https://www.erlang.org/patches/otp-27.0 二&#xff0c;rabbitMQ客户端安装 https://www.rabbitmq.com/docs/install-windows &#xff08…...

分页以及tab栏切换,动态传类型

<view class"disTitle"><view class"disName">账户明细</view><view class"nav"><u-tabs lineWidth"0" :activeStyle"{color: #FD893F }" :list"navList" change"tabsChange&quo…...

【算法】平衡二叉树

难度&#xff1a;简单 题目 给定一个二叉树&#xff0c;判断它是否是 平衡二叉树 示例&#xff1a; 示例1&#xff1a; 输入&#xff1a;root [3,9,20,null,null,15,7] 输出&#xff1a;true 示例2&#xff1a; 输入&#xff1a;root [1,2,2,3,3,null,null,4,4] 输出&…...

五、 计算机网络(考点篇)

1 网络概述和模型 计算机网络是计算机技术与通信技术相结合的产物&#xff0c;它实现了远程通信、远程信息处理和资源共享。计算机网络的功能&#xff1a;数据通信、资源共享、管理集中化、实现分布式处理、负载均衡。 网络性能指标&#xff1a;速率、带宽(频带宽度或传送线路…...

如何解决数据分析问题:IPython与Pandas结合

如何解决数据分析问题&#xff1a;IPython与Pandas结合 数据分析是现代科学研究、商业决策和技术开发中的一个重要环节。IPython和Pandas是两个强大的工具&#xff0c;它们可以大大简化和加速数据分析的过程。本文将为初学者详细介绍如何结合使用IPython和Pandas来解决数据分析…...

如何在 Microsoft Edge 上使用开发人员工具

Microsoft Edge 提供了一套强大的开发人员工具&#xff0c;可帮助 Web 开发人员检查、调试和优化他们的网站或 Web 应用程序。 无论您是经验丰富的 Web 开发人员还是刚刚起步&#xff0c;了解如何有效地使用这些工具都可以对开发过程产生重大影响。 在本文中&#xff0c;我们…...

《Linux系统编程篇》认识在linux上的文件 ——基础篇

前言 Linux系统编程的文件操作如同掌握了一把魔法钥匙&#xff0c;打开了无尽可能性的大门。在这个世界中&#xff0c;你需要了解文件描述符、文件权限、文件路径等基础知识&#xff0c;就像探险家需要了解地图和指南针一样。而了解这些基础知识&#xff0c;就像学会了魔法咒语…...

Qt:22.鼠标相关事件(实例演示——鼠标进入/离开某控件的事件、鼠标按下事件、鼠标释放事件、鼠标双击事件)

目录 1.实例演示——鼠标进入/离开某控件的事件&#xff1a; 2.鼠标按下事件&#xff1a; 3.鼠标释放事件&#xff1a; 4.鼠标双击事件&#xff1a; 1.实例演示——鼠标进入/离开某控件的事件&#xff1a; 首先创建一个C类文件 Label&#xff0c;填写好要继承的父类 QLabe…...

笔记 4 :linux 0.11 中继续分析 0 号进程创建一号进程的 fork () 函数

&#xff08;27&#xff09;本条目开始&#xff0c; 开始分析 copy_process () 函数&#xff0c;其又会调用别的函数&#xff0c;故先分析别的函数。 get_free_page &#xff08;&#xff09; &#xff1b; 先 介绍汇编指令 scasb &#xff1a; 以及 指令 sstosd &#xff1a;…...

Vue3 引入Vanta.js使用

能搜到这篇文章 想必一定看过demo效果图了吧 示例 Vanta.js - Animated 3D Backgrounds For Your Website (vantajs.com) 1. 引入 在根目录 index.html中引入依赖 <script src"https://cdnjs.cloudflare.com/ajax/libs/three.js/r134/three.min.js"></sc…...

LeetCode --- 134双周赛

题目 3206. 交替组 I 3207. 与敌人战斗后的最大分数 3208. 交替组 II 3209. 子数组按位与值为 K 的数目 一、交替组 I & II 题目中问环形数组中交替组的长度为3的子数组个数&#xff0c;主要的问题在于它是环形的&#xff0c;我们要考虑首尾相接的情况&#xff0c;如何…...

快速读出linux 内核中全局变量

查问题时发现全局变量能读出来会提高效率&#xff0c;于是考虑从怎么读出内核态的全局变量&#xff0c;脚本如下 f open("/proc/kcore", rb) f.seek(4) # skip magic assert f.read(1) b\x02 # 64 位def read_number(bytes):return int.from_bytes(bytes, little,…...