👉博__主👈：米码收割机
👉技__能👈：C++/Python语言
👉公众号👈：测试开发自动化【获取源码+商业合作】
👉荣__誉👈：阿里云博客专家博主、51CTO技术博主
👉专__注👈：专注主流机器人、人工智能等相关领域的开发、测试技术。
系列文章目录
目录
- 系列文章目录
- HTML (HyperText Markup Language)
- 标签与属性
- 表单
- CSS (Cascading Style Sheets)
- 选择器
- 盒模型
- JavaScript
- 数据类型
- 函数
- 事件
- DOM (Document Object Model)
- <center>本期好书推荐
HTML (HyperText Markup Language)
标签与属性
HTML 使用标签来定义内容。每个标签通常都有一个开始标签和结束标签。例如，<p> 是段落标签的开始标签，</p> 是其结束标签。
<p>这是一个段落。</p>
许多标签还可以有属性，属性为标签提供额外的信息。例如，<a> 标签可以有 href 属性指定链接地址。
<a href="https://www.example.com">访问 example.com</a>
表单
HTML 中的表单允许用户输入数据：
<form action="/submit" method="post">
<input type="text" name="username" placeholder="输入用户名">
<input type="password" name="password" placeholder="输入密码">
<input type="submit" value="登录">
</form>
CSS (Cascading Style Sheets)
选择器
CSS 使用选择器来确定哪些元素应该应用哪些样式：
- 元素选择器：如
h1,p,a等。 - 类选择器：以
.开头，如.highlight。 - ID 选择器：以
#开头，如#header。
盒模型
每个 HTML 元素都可以视为一个盒子，并且有 padding, border, margin 和 content。这被称为 CSS 盒模型。
JavaScript
数据类型
JavaScript 中有几种基本的数据类型：
- Number: 如 123, 12.3
- String: 如 “Hello”, ‘World’
- Boolean:
true或false - Object: 如
{ name: 'John', age: 30 } - Array: 如
[1, 2, 3]
函数
函数是一组代码，可以接受参数并返回一个值：
function add(x, y) {
return x + y;
}
事件
JavaScript 可以响应各种事件，例如点击、键盘按键、鼠标移动等。这使得网页具有交互性。
document.getElementById('myButton').addEventListener('click', function() {
alert('按钮被点击了！');
});
DOM (Document Object Model)
DOM 是一个编程接口，它表示页面的结构。通过 DOM，JavaScript 可以访问和修改页面内容。
// 获取一个元素
var elem = document.getElementById('myDiv');
// 修改元素内容
elem.innerHTML = '新的内容';
本期好书推荐 《HTML5+CSS3+JavaScript从入门到精通（微课精编版）（第2版）（清华社“视频大讲堂"大系 网络开发视频大讲堂）》
京东：https://item.jd.com/13524363.html
当当：http://product.dangdang.com/29482128.html
