javascript
关注
分享
扫一扫
kllo__
这个作者很懒，什么都没留下…
展开
-
JavaScript：导出类或对象
了解如何在Node.js中导出类或对象Node.js生态系统中的许多模块只导出一个对象，该对象集合了模块的所有功能。为此，它们重新分配 modele.exports 对象，而不是向其添加属性。例如，查看下面模块 calculator.js 是如何定义的。// Declare a factory function that returns an object literalconst createCalc = () => { // The returned...原创 2022-05-18 15:55:42 · 4238 阅读 · 0 评论 -
JavaScript：Node.js模块
本节主要了解模块化的好处以及如何在Node.js中使用模块。模块化的好处模块化背后的总体思想非常简单，类似于函数背后的思想。与其将所有代码都写在一个地方，从而创建一个单一的应用程序，不如将功能拆分成更小的、松散耦合的部分。每个部分都应该专注于特定的任务，使其容易理解和重用。通用应用程序的行为来自这些构建块之间的交互。这些较小的部分有时在其他环境中被称为组件。在Node中，它们被称为 模块，可以有不同的形式。根据模块的一般定义，它是可以使用 Node...原创 2022-05-16 15:55:14 · 144 阅读 · 0 评论 -
JavaScript：将数据发送到Web服务器
发送数据：基础向服务器发送数据通常是通过 HTTP 的 post 方法完成的。在这种情况下，请求正文包含要发发送的数据。数据格式取决于服务器的期望。它可以是：键值对，例如直接提交表单时。 Json 格式：可以用于更多结构化数据。将表单数据发送到服务器 如果 Web 服务器需要直接的表单数据，您可以使用 JavaScript 的 FormData 对象来封装要发送的信息。下面是一个示例的表单，用于选择最强壮的动物以及处理表单提交的JS代码。<ht...原创 2022-03-09 16:02:04 · 3176 阅读 · 0 评论 -
JavaScript编码练习：获取github上公开的用户信息并展示
问题描述在输入框输入用户名，页面将显示用户的头像、姓名 和 个人网址。给定代码：<html> <head> </head> <body> <h3> Information about a Github user </h3> <form id="form1"> <input type="text" name="login"> <input type="s...原创 2022-03-09 15:04:17 · 883 阅读 · 0 评论 -
JavaScript编程挑战：从 Punk API 和 SWAPI 获取信息并展示在页面上
问题一：展示关于啤酒的详细信息问题描述获取有关所展示啤酒的其他信息：酒精度数（ABV）、体积和首次酿造的日期。预期输出解决方法<html> <head> </head> <body> <button id="grabButton">Grab a beer</button> <div id="beer"></div>...原创 2022-03-09 14:11:41 · 704 阅读 · 0 评论 -
Qt：建立带有子项目的项目，以及子项目之间的调用
建立带有子项目的项目选择 其他-> 子项目目录然后根据指导下一步即可。建立好项目之后，就可以往项目中添加各种子项目。向项目中添加子项目 右键项目，选择 Library然后根据向导进行下一步操作即可，完成后的 .pro 文件是这样的显示创建的类型的 lib，动态库在项目中调用子项目 所有的子项目虽然都在一个大的项目下面，但是它们互相之间是独立的，如果某一个想要调用另一个子项目，比如上面的库文件，需要然后选中你创建的...原创 2022-03-01 17:04:47 · 4156 阅读 · 2 评论 -
使用JavaScript调用Web API，Web API 和身份验证
以下的示例显示了如何使用 JavaScript 调用 Web API。<html> <head> </head> <body> <h2> Some blog articles</h2> <div id="articles"></div> </body></html>// Fetch data from the APIfetch("https://...原创 2022-02-28 17:02:08 · 1317 阅读 · 0 评论 -
JavaScript编码练习：将有关名画的信息从Json文件加载到网页上
问题描述json 文件：[ { "name": "The Starry Night", "year": "1889", "artist": "Vincent Van Gogh" }, { "name": "The Scream", "year": "1893", "artist": "Edvard Munch" }, { "name": "Guernica", "year": "1937", "artist原创 2022-02-25 15:37:03 · 341 阅读 · 0 评论 -
JavaScript编码练习：从Web服务器获取文本文件的内容，并将内容填充到HTML网页
问题描述<html> <head> </head> <body> <h2>A few programming languages</h2> <ul id="languageList"> </ul> </body></html>预期输出：解决办法 我的：//Write-Your-Code-Herefetch(...原创 2022-02-25 15:14:55 · 588 阅读 · 0 评论 -
在JavaScript 中创建异步HTTP请求
由于同步请求会阻塞调用过程，直到它们的结果被接收，所以在构建Web应用程序时应该只使用异步HTTP请求。然而，异步代码的编写和理解可能很棘手，因为语句不会像同步操作那样以线性和顺序的方式执行。fetch()方法JavaScript中发送异步HTTP请求的最佳方式是使用fetch()方法。下面是它的一般用法：// Sends an asynchronous HTTP request to the target urlfetch(url) .then(() =...原创 2022-02-25 14:26:00 · 922 阅读 · 0 评论 -
JSON,一种用于Web的数据格式
AJAX中的"X"字母代表XML，一种通用标记语言，曾经是跨平台数据交换的标准。虽然仍在使用中，但XML相当冗长，并且倾向于被Json取代，称为Web上的标准数据格式。JSON或JavaScript Object Notation 是一种用于描述结构化信息的文本语法。正如您将在以下示例中看到的，JSON大量借鉴了JavaScript对象语法。{ "cars": [ { "model": "Peugeot", "color": ...原创 2022-02-24 17:11:44 · 496 阅读 · 0 评论 -
从网站到Web应用程序
Web开发模型在传统的 Web开发场景中，当您单击链接或提交表单时，您的浏览器回向服务器发送一个请求，该请求会返回一个根据您非请求量身定制的全新网页。此模型的加载时间较长且交互性有限。另一种Web开发模型旨在避免为每个用户操作传输一个全新的网页。以下是该模型中的工作方式：通过JavaScript 事件处理程序拦截页面上的用户操作。 HTTP请求被发送到服务器而不中断页面上的导航。 只有页面的所需部分会使用请求是结果进行更新。尽管更具挑战性，但...原创 2022-02-24 16:43:45 · 178 阅读 · 0 评论 -
JavaScript：网络如何运作？
网络服务器要在线查看网站，必须在服务器上发布。服务器是一种特殊的机器，其任务是倾听和回答客户的需求。在 Web 上发布资源的服务器在逻辑上被称为 Web 服务器。更准确地说，一个网络服务器机器运行一个特定的软件程序（也称为网络服务器），能够发布网站。最流行的是 Apache、Microsoft IIS 和 nginx。网络客户端向服务器请求资源的机器称为 Web 服务端。实际上，真正的客户端是机器上运行的软件程序。一种众所周知的 Web 客户端...原创 2022-02-24 15:08:54 · 424 阅读 · 0 评论 -
JavaScript:社交新闻网页
建立在之前的基础上：javascript:新闻链接的显示、添加、与删除_kllo__的博客-优快云博客目标建立一个社交新闻网页功能需求1、链接由其标题、URL和作者（提交者）组成 2、如果新链接URL不以“http://”或“https://”开头，则自动在其开头添加“http://” 3、该网页至少显示三个现有的链接 4、存在一个供新用户提交新链接的按钮。单击按钮时，链接列表前会出现...原创 2022-02-24 10:48:30 · 482 阅读 · 0 评论 -
JavaScript 编码练习：添加动画使图片在页面上来回移动
问题描述根据以下给出的 HTML 和 CSS 代码，编写 JavaScript 代码使球水平弹跳。#ball { position: relative; left: 0px;}<html> <head> </head> <body><p> <button id="start">Start</button> <button id="stop" disabled>原创 2022-02-23 14:11:07 · 339 阅读 · 0 评论 -
JavaScript：页面动画元素，为 HTML 中的元素添加动画
本节将学习如何添加实时动画。例如，在页面上从左到右移动 <div> 类型元素。这个 <div> 将显示为红色，并且在页面加载时，从左到右地移动。#frame { border: 1px solid red;}#block { width: 20px; height: 40px; background: red; position: relative;}<html> <head> </head> &l原创 2022-02-21 16:15:05 · 2253 阅读 · 0 评论 -
JavaScript：使用网络动画-定期重复一个动作
在本节中，将学习如何使用定时器修改元素的内容，下面给出例子：<html> <head> </head> <body> <h1 id="title">This page will self-destruct in <span id="counter">10</span> second(s)...</h1> </body></html>// Count ...原创 2022-02-21 15:40:11 · 496 阅读 · 0 评论 -
JavaScript：编码练习，输入首字母输入框自动联想以该字母开头的国家列表
问题描述 当用户在输入框中输入国家名称时，页面会显示相应国家的列表。单击建议的国家会替换输入框中的值。为简单起见，仅考虑以"A" 开头的国家。HTML:<html> <head> </head> <body> <label for="country">Enter a country name</label>: <input type="text" id="country"> <...原创 2022-02-18 10:58:40 · 544 阅读 · 0 评论 -
编码练习：JavaScript 点击下拉列表显示相关信息
问题描述点击下拉列表中的选项，加载选项对应的列表信息。给定HTML：<html> <head> </head> <body> <h1>A few of the Game of Thrones characters</h1> <form> <label for="house">House</label>: <select name="house" id="house原创 2022-02-18 10:15:13 · 862 阅读 · 0 评论 -
编码练习：JavaScript：验证输入的密码是否一致
问题描述验证两次输入的密码是否一致，以及密码是否满足要求：长度大于等于6，必须包含数字<html> <head> </head> <body> <form id = "myForm"> <p> <label for="password1">Enter the password</label>: <input type="password" name="password1原创 2022-02-17 17:04:25 · 2218 阅读 · 0 评论 -
JavaScrpt：正则表达式
模板 匹配的字符串 匹配的例子 不匹配的例子 abc 含有 "abc" 的字符串 "abc","abcdef","123abc456" "abdc","1bca","adbc","ABC" [abc] 含有 "a"，"b"或"c"的字符串 "abc","daef","bbb","123c45" "def","xyz","12345","BBB" [a-z] 字符串包含小写字母 "abc","12f34","_r_" "123原创 2022-02-17 16:11:44 · 327 阅读 · 0 评论 -
JavaScript：作为DOM元素的表单
访问表单域一个 <form> 标签对应一个 DOM 元素，这个 element 有一个元素属性，它将所有的表单输入字段集合在一起。您可以使用这个属性通过 name 属性或索引（在表单出现是顺序）访问字段。 下面的示例显示了示例表单的输入字段的一些信息。<html> <head> </head> <body> <form> <label for="username"> User...原创 2022-02-16 16:53:59 · 439 阅读 · 0 评论 -
JavaScript表单：选择元素
了解在需要选择选项的网页上表示数据时派上用场的元素。复选框使用标签 <input type="checkbox"> 向HTML 表单添加复选框。下面代码向用户提供了是否接收确认电子邮件的选择。HTML 代码：<html> <head> </head> <body> <input type="checkbox" name="confirmation" id="confirmation"> &...原创 2022-02-16 15:47:14 · 315 阅读 · 0 评论 -
JavaScript中的表格：文本域
了解如何添加 JavaScript 函数来处理用户输入的表单数据。访问输入值文本字段允许用户在单行或多行上输入文本。定义文本字段有两种选择：单行文本字段在HTML中定义为 <input type="text">，而多行文本输入字段将通过定义<textarea>。下面这段代码允许用户输入用户名。<html> <head> </head> <body> <label for="username">原创 2022-02-15 16:37:14 · 1422 阅读 · 0 评论 -
编码挑战：JavaScript 向网页添加一个问题列表，可以通过点击按钮显示答案
问题描述以下是起始HTML:<html> <head> </head> <body> <div id="content"></div> </body></html>js代码：// Complete-This-Code// List of questions (statement + answer)const questions = [ { statement:.原创 2022-02-15 15:42:55 · 940 阅读 · 0 评论 -
编码挑战：JavaScript 利用按钮添加一个列表
问题描述在已有的 HTML 代码中定义了一个空的甜品列表。编写JavaScript 代码，在用户单击按钮时将新甜品添加到列表中，甜品的名称由用户输入。如果能实现单击甜点可以更改甜点的名称，这将是加分项。<html> <head> </head> <body> <h1>My favourite desserts</h1> <ul id="desserts"> </ul> &l原创 2022-02-15 15:05:42 · 545 阅读 · 0 评论 -
编码挑战：JavaScript 利用键盘改变div背景颜色
问题描述 编写相关 JavaScript 代码， div 根据用户按下的键（R-red,Y-yellow,G-green,B-blue）改变相应的背景颜色。给定的 HTML 代码：<html> <head> </head> <body> <p>Press the R (red), Y (yellow), G (green) or B (blue) key to change paragraph colors ac...原创 2022-02-15 14:25:21 · 519 阅读 · 0 评论 -
JavaScript：编码挑战：计算按钮点击次数
问题描述根据下面的 HTML 代码编写 JavaScript 代码，实现按 myButton 点击次数加1，通过 更新 clickCount 的数值来显示点击次数，按 deactivate 按钮停止计数。HTML 代码：<html> <head> </head> <body> <button id="myButton">Click me!</button> <p>You clicked on the原创 2022-02-15 11:44:55 · 3920 阅读 · 0 评论 -
JavaScript：进一步了解事件
事件传播DOM 将网页表示为节点的层次结构。在子节点上触发的事件将在父节点上触发的事件将在父节点上触发，然后是父节点的父节点，直到 DOM 的根节点（document 变量），这称为 事件传播。要查看实际传播情况，请使用此 HTML 代码创建一个小型 DOM 层次结构。<html> <head> </head> <body> <p id="para">A paragraph with a <button id="propa原创 2022-02-15 10:29:51 · 160 阅读 · 0 评论 -
JavaScript：响应页面事件
页面加载根据网页的复杂程度，浏览器可能需要一些事件才能完全加载网页。您可以在 window 对象（表示浏览器窗口）产生的 load （加载）事件上添加一个事件监听器，以了解何时发生这种情况。这避免了 JavaScript 与未完全加载的页面进行交互的混乱情况。页面完全加载后，以下代码会在控制台中显示一条消息。// Web page loading eventwindow.addEventListener("load", e => { console.log("The page ha原创 2022-02-14 16:57:46 · 590 阅读 · 0 评论 -
JavaScript：对鼠标事件做出反应
鼠标点击任何 DOM 元素都会产生该 click 类型的事件。鼠标事件属性与点击事件有关的 Event 对象有一个 button 属性，让你知道鼠标按钮的使用情况，还有 clientX 和 clientY 属性返回点击发生的位置的水平坐标和垂直坐标。这些坐标是相对于浏览器当前显示的页面区域定义的。 下面的代码显示了网页上发生的所有点击事件的信息。与时间关联的 mouseInfo() 函数调用一个另一个名为 getMouseButton() 的函数来检索单击的鼠标按钮...原创 2022-02-11 14:05:03 · 529 阅读 · 0 评论 -
JavaScript：对键盘事件做出反应
对键盘上的事件作出反应的最常见解决方案涉及处理 Web 页面上发生的 keypress 事件（DOM 主体元素（body element）。对应于 JavaScript 中被称为 document 的全局变量）。键盘事件属性 下面这个例子在控制台中显示了与按下的键相关的字符。字符信息由于事件关联的事件对象的 charCode 属性给出。该属性返回一个数字值（被称为 Unicode 值），可以通过 String.FromCharCode() 方法转换为一个字符串值。// Show ...原创 2022-02-11 11:17:00 · 428 阅读 · 0 评论 -
JavaScript 中的事件分类
DOM 元素可以触发多种类型的事件。以下是主要事件类别。类别 例子 键盘事件 按下或释放一个键 鼠标事件 按下或释放一个键 窗口事件 加载或关闭网页、调整大小、滚动 表单时间 更改表单字段的焦点，提交表单 每个事件都和一个事件对象相关联，该对象具有属性（关于时间的信息）和方法（对事件进行操作的方法）。此对象可由处理函数使用。与事件关联的对象的许多属性取决于事件 type。有些属性总是存在的，比如事件返回类型 type ...原创 2022-02-11 10:41:31 · 229 阅读 · 0 评论 -
简单介绍 JavaScript 中的事件
为了增加交互性，页面应该对用户的操作做出反应：点击按钮、填写表单等。用户的动作触发了 JavaScript 编写的用来处理的事件。这种编写程序的方式被称为事件驱动编程。它普遍用于程序需要与用户进行交互的时候。第一个例子 点击按钮，弹出“hello”<html> <head> </head> <body> <button id="myButton">Click me!</button>...原创 2022-02-11 10:05:50 · 464 阅读 · 0 评论 -
编码练习：使用 JS 向网页中添加一个列表
问题原始网页如下：代码如下：以下分别是 html 和 css 代码<html> <head> </head> <body> <div id="content">ABC <br>Easy as <br>One, two, three</div><div id="infos"></div> </body></htm.原创 2022-02-10 17:26:09 · 717 阅读 · 0 评论 -
编码练习：使用 JavaScript 改变网页的颜色
<html> <head> </head> <body><h1>Paragraph 1</h1><div>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec dignissim fringilla dapibus. Curabitur placerat efficitur molestie. Quisque quis consequat n.原创 2022-02-10 13:54:08 · 419 阅读 · 0 评论 -
通过 JavaScript 改变元素的样式
<html> <head> </head> <body> <p>First</p> <p style="color: green;">Second</p> <p id="para">Third</p> </body></html>样式属性DOM 元素具有一个名为 style 的属性，该属性返回一个表示 HTML 元素 sty.原创 2022-02-09 16:01:17 · 2817 阅读 · 0 评论 -
使用 JavaScript 向网页中添加元素
创建元素// Create an li elementconst pythonElement = document.createElement("li"); 设置元素属性// ...pythonElement.id = "python"; // Define element IDpythonElement.textContent = "Python"; // Define its text content将元素插入 DOM// I...原创 2022-02-09 15:21:50 · 2429 阅读 · 0 评论 -
编码练习：获取网页中的链接数，输出第一条和最后一条链接
<html> <head> </head> <body><h1>Some musical instruments</h1><ul> <li id="clarinet" class="wind woodwind"> The <a href="https://en.wikipedia.org/wiki/Clarinet">clarinet</a> </li&g.原创 2022-02-09 14:23:25 · 289 阅读 · 0 评论 -
获取有关 DOM 元素的信息
示例HTML:<html> <head> </head> <body><h1>Seven wonders of the world</h1><p>Do you know the seven wonders of the world?</p><div id="content"> <h2>Wonders from Antiquity</h2>...原创 2022-02-09 13:58:50 · 292 阅读 · 0 评论