记录java学习日常~

Web 全称 World Wide Web，又称万维网，是一种基于超文本和HTTP协议的、以客户端和服务端之间的交互为核心的、分布式的信息系统。Web的核心技术是HTML（超文本标记语言）和HTTP（超文本传输协议）。Web上的信息资源可以是文本、图片、视频、音频等多种形式。基于超文本：通过将文本之间的关系用超链接（hyperlink）表示，实现文本之间的跳转和连接。分布式：信息资源可以分布在全球各地，用户可以通过网络进行访问。开放性：任何人都可以在 Web 上发布和访问信息资源。

Web 标准包括 HTML、CSS 和 JavaScript 等技术规范，以及 DOM（文档对象模型）、XML（可扩展标记语言）等技术。通过 XML，可以实现不同应用程序之间的数据交换和共享。这些技术规范的目标是确保页面的结构、表现和行为的分离，使得不同设备和用户代理之间能够更好地共享 Web 内容。降低开发成本：使用 Web 标准使得网站能够更好地在不同设备上表现，减少了针对不同设备进行开发和测试的成本。提高可访问性：遵循 Web 标准可以提高网站的可访问性，使得不同浏览器和设备能够更好地支持网站。

HTML，全称为超文本标记语言（HyperText Markup Language），是一种用于创建网页的标记语言。HTML 由一系列的标签和属性组成，HTML标签都是预定义好的，用于描述网页的结构和内容。

文档的标题文档的内容......

【代码】05-HTML-图片标签。

属性值描述compactcompactHTML5 中不支持。HTML 4.01 中不赞成使用。规定列表呈现的效果比正常情况更小巧。reversedreversed规定列表顺序为降序。(9,8,7...)startnumber规定有序列表的起始值。type1AaIi规定在列表中使用的标记类型。

属性值描述downloadfilename规定被下载的超链接目标。hrefURL规定链接指向的页面的 URL。ping规定以空格分隔的 URL 列表，当点击链接时，浏览器将发送带有正文 ping 的 post 请求（在后台）。通常用于跟踪。nameHTML5 中不支持。规定锚的名称。target_blank_parent_self_topframename规定在何处打开链接文档。

div> 是一个块级元素。它的内容自动地开始一个新行。可以通过 的 class 或 id 应用额外的样式。不必为每一个 都加上类或 id。可以对同一个 元素应用 class 或 id 属性，但是更常见的情况是只应用其中一种。这两者的主要差异是，class 用于元素组（类似的元素，或者可以理解为某一类元素），而 id 用于标识单独的唯一的元素。标签描述定义文档的样式信息。定义文档中的节。定义文档中的节。

规定表格相对周围元素的对齐方式。规定表格的背景颜色。

规定输入字段在页面加载时是否获得焦点。（不适用于 type="hidden"）覆盖表单的 action 属性。（适用于 type="submit" 和 type="image"）覆盖表单的 enctype 属性。（适用于 type="submit" 和 type="image"）覆盖表单的 method 属性。（适用于 type="submit" 和 type="image"）覆盖表单的 novalidate 属性。如果使用该属性，则提交表单时不进行验证。覆盖表单的 target

CSS（层叠样式表）是一种用于控制网页外观和布局的样式语言。它可以独立于 HTML 或 XHTML 文档，以及任何标记语言使用，因此可以用于设计不同类型的文档，如 XML、SVG、XUL 等。CSS 提供了广泛的样式选择器，包括元素类型、类别、id、属性和伪类别等，还可以针对不同媒体类型和响应视口大小自适应调整样式。可维护性强：CSS 文件可以被多个 HTML 文档共用，统一维护和更新，便于样式重复利用。适应性强：当需要修改某种样式时，只需修改一个 CSS 文件即可同时改变所有使用该样式的页面。

如果有多个选择器针对同一个元素定义了不同的样式，那么拥有 ID 选择器的规则将覆盖元素选择器的规则。需要注意的是，由于通用选择器能匹配到 HTML 中的所有标签，因此在代码中大量滥用通用选择器会导致 CSS 选择器的匹配过程变慢，影响页面性能。利用元素选择器，可以控制某个页面或整个网站内的某类 HTML 元素的样式，这些元素可以是段落、标题、图像、表格等标准的 HTML 元素。元素选择器根据元素名称来选择 HTML 元素。元素选择器会选择文档中所有符合条件的元素，并将相同的样式应用于所有选中元素。

简写属性设置target-name, target-new,和target-position属性。设置或检索对象的背景图像如何铺排填充。设置或检索对象的背景图像位置。指定是否有新的目标链接打开一个新窗口或在现有窗口打开新标签。检索或设置对象的背景图像的尺寸大小。设置对象的背景特性。设置对象边框的特性。指定应该放置新的目标链接的位置。在一个声明中设置所有外边距属性。在一个声明中设置所有填充属性。在一个声明中设置所有字体属性。设置或检索对象的背景颜色。设置或检索对象的背景图像。设置或检索对象的边框颜色。

CSS渐变色（Gradient）是指在元素背景中使用两种或多种不同的颜色进行过渡，超过两个颜色可以形成更为细腻的渐变效果。常见的CSS渐变色有线性渐变和径向渐变。线性渐变从一个颜色到另一个颜色沿着一条直线渐变，实现代码如下：其中，direction参数指定了线性渐变的方向，可以是to top、to bottom、to right、to left、to top left等等值；color-stop表示颜色变化节点，可以设置百分比值或距离值。以下CSS代码定义了从左上到右下的渐变色背景： 径向

下面的代码定义了一个简单的关键帧集，这个关键帧集包括三个关键帧（from、50%、to），在 from 关键帧中，元素的宽度为 100px，高度为 100px，在 to 关键帧中，元素的宽度为 300px，高度为 300px，在 50% 的关键帧中，元素的宽度为 200px，高度为 200px。from {50% {to {当在@keyframes创建动画，把它绑定到一个选择器，否则动画不会有任何效果。规定动画的名称规定动画的时长

JavaScript 是一种高级、基于事件驱动的编程语言，被广泛应用于 Web 前端开发和后端开发领域。JavaScript 可以嵌入到 HTML 页面中，通过对页面元素进行操作和交互，实现动态效果，并且能够与服务器进行数据交换，并根据返回结果修改页面内容等。它是一种解释性脚本语言，不需要编译即可直接运行。

内部JS示例");// 在页面加载完成后自动弹出提示框

需要注意的是，typeof 返回 "object" 的情况有两种：当值为 null 或对象时。5. 未定义类型（Undefined）：未被赋以任何值的变量默认为undefined。3. 布尔类型（Boolean）：代表 `true` 或 `false` 值。6. 符号类型（Symbol）：在ES6 中添加，它用于创建唯一的标识符。4. 空类型（Null）：用于存储未知或不存在的值。1. 数字类型（Number）：表示整数或浮点数。2. 字符串类型（String）：表示文本数据。

ES6（ECMAScript 2015）中引入了模板字符串（template string），也称为反引号字符串（back-tick string）或者标签模板（tagged template）。模板字符串是一种特殊的字符串，允许在其中插入变量值或者表达式，以及跨行定义字符串。

在 JavaScript 中，三元运算符（也称为条件运算符）用于根据某个条件来返回不同的值。它由三部分组成：一个条件表达式，一个 "?" 符号，以及两个可能的返回值。其中，condition 是一个要进行比较的值或表达式，如果它是 true，则返回前面的表达式 expr1，否则返回后面的表达式 expr2。

for...in 和 for...of 都是 JS 中的循环语句，用于遍历数组或对象中的元素。它们两个的区别在于，for...in 用于遍历对象中的属性名称，而 for...of 则用于遍历数组和类数组对象中的元素。

2、属性：以下是 function 类型中常见属性：3、特点： 可以作为变量使用：在 JavaScript 中，函数可以像其他任何值一样被赋值、传递和操作。这意味着函数可以作为变量来使用，使得程序更加灵活和复杂。 代码重用：函数允许开发人员编写可重用的代码块，从而减少了代码的重复和冗余。可以将某些代码拆分成独立的函数来提高代码维护性和可读性。 封装：函数可以使用局部变量来隐藏其内部实现，并只公开必要的接口。这有助于开发人员设计模块化和可靠的程序。 支持递归：JavaScript 函数支

以上代码中，我们首先获取了全选复选框和子复选框的元素，然后给全选复选框添加了一个 change 事件监听器。当全选复选框的状态改变时，我们遍历所有子复选框并将它们的选中状态设置为与全选复选框相同。这样就可以实现表单的全选功能了。注意：上面示例中使用了 name="fruit[]" 来指定子复选框的名称，并且使用了 querySelectorAll 方法获取子复选框的元素。

要在 JavaScript 中生成随机数，可以使用 Math 对象提供的方法，比如 Math.random() 方法。这个方法会返回一个 0 到 1 之间的伪随机数，其结果是一个浮点数，且包括 0，但不包括 1。上面的代码使用 Math.random() 方法生成了一个随机数，并将其输出到控制台，即可看到结果。

箭头函数的另一个重要特点是它的作用域绑定。箭头函数没有自己的 this，它的 this 值是继承自父级作用域的。这就意味着，在箭头函数内部，this 所指向的是定义箭头函数时所处的对象或上一层作用域中的 this 值。需要注意的是，箭头函数通常用于匿名函数表达式，因此它们经常被用作回调函数、迭代函数和事件处理程序等地方。在这些情况下，我们可以通过升级函数语法来使代码更加简洁和易读。

BOM（Browser Object Model）是浏览器对象模型的缩写，指的是由浏览器提供的一组对象和方法，可以通过JavaScript来操作和管理浏览器。全局作用域：Window对象是全局对象，它包含了所有的JavaScript变量和函数。因此，可以在脚本的任何地方访问和修改Window对象的属性和方法。对象层次结构：如果窗口中嵌套了框架，则每个框架都是一个Window对象。Window对象形成了一个对象层次结构，可以通过Window的属性和方法来访问和操作其中的文档和元素。

可以使用定时器 setInterval() 或 setTimeout() 来实现倒计时功能。这两个方法的作用类似，都用于周期性地调用函数。

操作节点：可以使用 createElement() 和 createTextNode() 方法来创建新节点，appendChild()、insertBefore()、removeChild()、replaceChild() 等方法来操作节点。DOM的核心概念是节点（node），一个节点可以是元素、属性、文本或者其他类型的HTML或XML元素。CSS 操作：可以通过 element.style 来设置和修改元素的 CSS 样式，也可以使用 getComputedStyle() 方法获取元素的样式信息。

在 JavaScript 中， Document 对象是浏览器提供的最基本的 DOM 接口。它是表示 HTML 或 XML 页面中整个文档的对象，在 DOM 树中属于根节点（即最上层节点）。通过 Document 对象，可以操作整个文档，包括访问文档的元素、属性、样式和事件等。创建属性节点。创建带有指定文本的 Comment 节点。创建元素节点。创建文本节点。返回拥有指定值的 ID 属性的元素。返回包含拥有指定类名的所有元素的。返回包含拥有指定名称的所有元素的活动。返回包含拥有指定标签名称的所有元素的。

在 DOM 树中，每个 HTML 元素都是一个 Element 对象，它们是 Document 对象的子节点。Element 对象表示 HTML 元素，并且有许多属性和方法可以用于操作这些元素的内容和样式。

在 DOM 树结构中，每个元素、文本节点、注释等都是一个 Node 对象，它们都是 Document 对象的子节点。Node 对象代表文档树中的一个节点。

实现一个动态表格，包含三个输入框和一个添加按钮，用户可以输入编号、姓名、性别添加至表格，每行数据后面都有一个删除按钮可以删除对应行。同时在输入时会进行非空校验，在添加完一行数据后会将输入框清空以便下次输入。

JavaScript 事件（Event）是指在 HTML 文档中某些特定的交互动作或操作发生时，浏览器会自动触发并执行预先编写好的 JavaScript 代码。常见的交互动作或操作包括鼠标点击、键盘按下、网页加载完成等。

按键符号 keyCode 0 48 1 49 2 50 3 51 4 52 5 53 6 54 7 55 8 56 9 57 A 65 B 66 C 67 D 68 E 69 F 70 G 71 H 72 I 73 J 74 K 75 L 76 M 77 N 78

JS 焦点事件是针对 DOM 元素而言的，在 web 开发中控制焦点是一件非常普通但又非常重要的事情。当用户与页面交互时，焦点经常根据用户的行为进行切换，例如，当用户点击文本框时，焦点会自动切换到该文本框上。

HTML DOM（Document Object Model，文档对象模型）是指将 HTML 文档中的每个元素都作为一个对象来对待，并以树形结构来表示这些对象之间的关系。通过 HTML DOM，可以使用 JavaScript 来操作 HTML 页面中的任何元素。HTML DOM 的根节点是 document 对象，它代表了整个文档。一个 HTML 文档中的其他所有元素都可以作为文档对象的子节点进行访问和操作。

在这个示例中，我们定义了一个 Person 类，使用 constructor() 方法来初始化对象的属性。同时，我们定义了一个 sayHello() 方法，用于输出人的信息。

jQuery 是一款流行的 JavaScript 框架，被广泛应用于 Web 开发中。它简化了 DOM 操作、事件处理、动画效果等常见任务，提供了丰富的 API 和插件，让开发者能够快速地实现各种功能。jQuery设计的宗旨是"write Less，Do More"，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Ajax交互。

在 jQuery 中，我们可以使用 $() 函数或 jQuery() 函数来获取元素，并返回一个 jQuery 对象。而在 JavaScript 中，则可以使用 document.getElementById() 或 document.querySelector() 方法来获取元素，并返回一个 JavaScript 对象。在 jQuery 中，一个 jQuery 对象包含了一组相匹配的 DOM 元素，并提供了一系列用于操作这些元素的方法。而 JavaScript 对象则可以包含任意类型的属性和方法。

on() 方法是 jQuery 中最常用且最通用的事件绑定方法，可以绑定多个事件类型，并为每个事件类型指定一个或多个处理程序。click() 方法是一种简洁的事件绑定方法，只能绑定 click 事件，并且只允许绑定一个处理程序，无法为同一个元素绑定多个处理程序。off() 方法用于移除之前绑定的事件处理程序，它需要传递一个或多个事件类型参数，并为这些事件类型制定要移除的处理程序。jQuery 事件绑定中，on() 方法用于为元素添加事件处理程序，off() 方法则用于移除绑定的事件处理程序。