使用 JavaScript 构建下拉组件

在本教程中，我们将使用vanillaJavaScript创建一个可重用的自定义下拉组件。一个什么？减少菜单或导航足迹的一种策略是在下拉组件中放置额外的链接。这个想法是用户单击以显示更多选项，从而为他们提供更多浏览网页的方式，同时保持UI清洁。对于本教程，我假设我们正在为营销机构网站构建一个组件。我们正在建设什么这是我们灵活的下拉导航。单击...

预加载图像的最佳方式

要改善您网站上的用户体验，您可以做的最重要的事情之一就是确保人们不会花时间等待图像或其他元素的加载。网页及其所有内容的加载速度取决于很多因素，其中一些因素是您无法控制的。但是，作为Web开发人员，我们应该尽最大努力使浏览体验尽可能无缝。在本教程中，我将向您展示在网页上预加载图像以获得流畅用户体验的不同技术，使用JavaScript、CSS和...

如何在JavaScript中生成随机数和字符串

生成随机数或字母数字字符串的能力在许多情况下都能派上用场。您可以使用它在游戏中的不同位置生成敌人或食物。您还可以使用它向用户建议随机密码或创建文件名来保存文件。我写了一篇关于如何在PHP中生成随机字母数字字符串的教程。在那篇文章的开头，我说几乎没有事件是真正随机的，同样的事情也适用于随机数或字符串生成。在本教程中，我将向您展示如何在JavaSc...

使用 JavaScript 创建点击复制按钮

本教程是关于使用简单的JavaScript、HTML和CSS创建点击复制实用程序的简短指南。多年来，点击复制实用程序已成为编程界的流行模式。我经常看到开发人员使用它来快速复制API密钥、代码片段、数字等。这种模式在更多技术领域的出现激发了许多现代网站在其产品中实施相同的设计，以提高用户的整体体验。我们正在建设什么单击复制实用程序可以采用...

如何使用 Vanilla JavaScript 从网页中抓取数据

在本教程中，我们将了解如何在浏览器的开发工具中使用JavaScript从任何网页抓取数据。如果您曾经不得不手动将网页中的数据整理成不同的格式，例如电子表格或数据对象，您就会知道这是一个非常重复且令人厌烦的过程！幸运的是，大多数浏览器都包含允许您随心所欲地操纵任何网页的工具。这些工具被称为开发者工具（通常称为开发工具），通常被Web开发者用来...

学习使用 JavaScript 编码：基础知识

您如何在没有编码知识的情况下设计新鲜的网站和博客？您不需要聘请网页设计师。这就是BlogDesignerPro的用武之地！ JavaScript是一种语言，我们可以使用它来编写在浏览器或使用Node.js的服务器上运行的程序。由于有Node，您可以使用JavaScript构建完整的Web应用程序，例如Twitter...

如何使用 CSS 和 JavaScript 构建非画布菜单

在本教程中，我们将通过一种简单而有效的方法来使用HTML、CSS和JavaScript创建画布外菜单。要初步了解我们将要构建的内容，请查看相关的CodePen演示（查看 更大的版本 以获得更好的体验）：SeethePen Off-CanvasMenuWithCSSandaTouch...

如何使用 JavaScript 鼠标事件制作多预览缩略图

在本教程中，我们将通过构建一些有用且有趣的东西来享受JavaScript鼠标事件的乐趣：缩略图，当鼠标悬停在上面时，会显示一系列不同的电子书。这是我们要构建的演示（在每个缩略图上移动鼠标）：SeethePen HowtoMakeMulti-PreviewThumbnailsWithJavaScriptMous...

如何使用 CSS 和一点 JavaScript 构建 Accordion 组件

在今天的教程中，我们将学习如何使用CSS和一点JavaScript构建一个显示/隐藏组件。默认情况下，jQuery提供了slideToggle 允许我们通过滑动创建手风琴的方法。我们的挑战是用纯JavaScript模仿这个功能。这是我们将要创建的组件：SeethePen HowtoBuildan...

使用 CSS 和 JavaScript 创建一个非常简单的视差效果

在这个教程中，我们将学习为英雄图像添加一个简单但有用的视差滚动效果。为了实现它，我们将使用一些JavaScript代码，但请记住，您可以通过组合3D变换来创建纯CSS视差网站。这是我们要构建的页面。向下滚动！SeethePen AVerySimpleParallaxEffectWithCSS&...