html,css,javascript基础知识
web前端网页设计知识点
web前端网页设计知识点Web前端设计是指通过使用HTML、CSS和JavaScript等技术来开发网站的外观和交互功能。
在进行Web前端网页设计时，我们需要掌握一些基本的知识点。
本文将详细介绍一些常用的Web前端设计知识点，帮助读者更好地理解和应用这些技术。
一、HTML（超文本标记语言）知识点HTML是一种用于创建网页的标记语言，它使用标签和属性来描述网页的结构和内容。
以下是一些常用的HTML知识点：1. DOCTYPE声明：<!DOCTYPE>声明位于HTML文档的最前面，用于声明文档使用的HTML版本。
2. 标题和段落：使用<h1>至<h6>标签定义标题的级别，使用<p>标签定义段落。
3. 链接和图像：使用<a>标签创建链接，使用<img>标签插入图像。
4. 列表和表格：使用<ul>、<ol>和<li>标签创建无序列表、有序列表和列表项，使用<table>、<tr>和<td>标签创建表格。
5. 表单和输入元素：使用<form>标签创建表单，使用<input>标签创建各种输入元素，如文本框、复选框和按钮。
二、CSS（层叠样式表）知识点CSS用于控制网页的布局和样式，使网页更加美观和易于阅读。
以下是一些常用的CSS知识点：1. 选择器：CSS使用选择器来选择要应用样式的HTML元素。
常见的选择器有标签选择器、类选择器、ID选择器和属性选择器。
2. 盒子模型：每个HTML元素都被看作一个矩形的盒子，包括内容区、内边距、边框和外边距。
通过设置这些属性，可以调整元素在网页中的位置和大小。
3. 背景和边框：使用CSS可以设置元素的背景颜色、背景图像和边框样式。
4. 文本样式：可以通过设置字体、颜色、大小、行高和对齐方式等属性来调整文本的样式。
前端三件套知识点-概述说明以及解释
前端三件套知识点-概述说明以及解释1.引言1.1 概述概述部分的内容应该对前端三件套的基本概念进行介绍，简要说明HTML、CSS和JavaScript在前端开发中的作用和重要性。
HTML是一种标记语言，用于描述网页的结构和内容。
通过使用HTML，我们可以定义网页的标题、段落、图像、链接等元素。
HTML为网页提供了基本的骨架和结构。
CSS是一种样式表语言，用于控制网页的外观和布局。
通过使用CSS，我们可以设置网页中各个元素的颜色、字体、大小、对齐方式等样式属性，从而实现网页的美化效果。
JavaScript是一种脚本语言，用于给网页增加交互性和动态特效。
通过使用JavaScript，我们可以实现网页中的表单验证、按钮点击事件、动态加载内容等功能，使网页具有更好的用户体验和交互性。
前端三件套HTML、CSS和JavaScript相互协作，共同构建了现代网页的基础。
HTML负责定义网页的结构，CSS负责控制网页的样式，JavaScript负责处理网页的交互逻辑。
他们的配合使用，为开发者提供了丰富的工具和技术，使得前端开发能够更加便捷和灵活。
在本文中，我们将深入探讨前端三件套的各个知识点，从入门到深入，帮助读者全面了解并掌握前端开发的基础知识。
1.2 文章结构文章结构是指文章的组织方式和层次结构，它决定了文章整体的逻辑框架和信息传递的顺序。
在本文中，主要分为引言、正文和结论三个部分。
引言部分用来引入读者进入文章的主题，并对本文的内容进行一个概述。
这样可以帮助读者了解文章的主旨和目的。
正文部分是文章的主体，用来详细阐述前端三件套中的HTML基础知识、CSS基础知识和JavaScript基础知识。
在每个子节下，可以进一步展开具体的知识点，如HTML标签的使用、CSS样式的应用和JavaScript 语法的学习。
在这部分中，可以结合实例来说明，配以图表或代码片段，帮助读者更好地理解和掌握这些知识点。
结论部分是对整篇文章的总结和归纳。
网页设计制作知识点
网页设计制作知识点1. 基础知识1.1 HTML（Hypertext Markup Language）HTML是用于构建网页的标记语言，通过使用各种标签和属性，可以定义网页的结构和内容。
常见的HTML标签包括<head>、<body>、<div>、<p>等。
1.2 CSS（Cascading Style Sheets）CSS用于控制网页的样式和布局，通过将样式属性应用于HTML元素，可以改变它们的颜色、字体、大小等外观特性。
常见的CSS属性包括color、font-family、margin、padding等。
1.3 JavaScriptJavaScript是一种用于增加网页交互性的脚本语言，可以通过在网页中嵌入JavaScript代码来实现动态效果、表单验证等功能。
2. 响应式设计响应式设计是指根据设备的屏幕尺寸和分辨率，自动调整网页的布局和内容，以确保在不同设备上都能正常显示和使用。
常见的响应式设计技术包括媒体查询（Media Queries）、流体布局（Fluid Layout）和弹性图片（Flexible Images）等。
3. 网页导航3.1 导航栏导航栏用于展示网站的主要导航链接，通常位于页面的顶部或侧边。
可以使用HTML和CSS创建导航栏，并为每个链接添加交互效果。
3.2 面包屑导航面包屑导航用于显示当前页面在网站结构中的位置，让用户可以方便地进行导航和返回。
可以使用HTML和CSS创建面包屑导航，并为每个链接添加合适的指向。
4. 网页布局4.1 盒子模型盒子模型是用于布局和定位网页元素的基础概念，每个HTML 元素都可以看作是一个矩形的盒子。
通过设置盒子的宽度、高度、内边距（padding）和外边距（margin），可以精确控制元素在网页中的位置和间距。
4.2 栅格系统栅格系统是一种用于创建响应式网页布局的技术，将页面划分为多个均等的列。
web前端考试知识点总结
web前端考试知识点总结一、HTML知识点总结1. HTML基础知识- HTML的基本结构- HTML的常用标签- HTML的元数据标签- HTML的列表、表格、表单等相关标签2. HTML5新增的语义化标签- header、footer、nav、article、section、aside等3. HTML5新增的表单元素- input的各种类型- 新增的表单元素如datalist、keygen等4. HTML5新增的媒体元素- video、audio等5. HTML5新增的API- 本地存储、离线应用、地理定位等二、CSS知识点总结1. CSS基础知识- CSS的语法- CSS的选择器- CSS的样式属性2. CSS布局- 盒模型- 浮动- 定位- 弹性盒子布局- 栅格布局3. CSS3新增的样式- 边框、背景、文字、渐变、阴影等效果 - 过渡、变换、动画等4. 响应式设计- 媒体查询- 移动优先5. CSS预处理器- SASS、LESS等三、JavaScript知识点总结1. JavaScript基础知识- 数据类型- 运算符- 流程控制语句2. JavaScript函数- 函数的定义- 作用域- 闭包- 高阶函数3. JavaScript对象- 对象的创建- 原型链- 对象的继承4. DOM操作- 节点的增删改查- 事件处理5. AJAX与跨域- XMLHttpRequest对象- 跨域访问的解决方案6. ES6知识点- let、const- 箭头函数- 解构赋值- 模板字符串- Promise等四、Web前端知识点总结1. 前端框架- Vue.js、React、Angular等- 每个框架的基本原理和使用方法2. 前端工程工具- Webpack、Gulp、Grunt等- 理解构建工具的作用和配置3. 前端性能优化- 页面加载速度优化- 代码性能优化4. 前端安全- XSS、CSRF、点击劫持等- 前端安全常见问题和解决方案5. 前端测试- 单元测试- UI测试6. 前端工程化- 模块化开发- 前端构建流程综上所述，Web前端技术知识点之多之杂，要想在考试中取得好成绩，需要对各种知识点进行深入理解和掌握。
网页设计期末知识点总结
网页设计期末知识点总结一、HTML基础知识1. HTML是什么，它的作用和用途2. HTML元素的基本语法和结构3. HTML标签的分类和用法4. HTML实体字符的表示和使用5. HTML的注释和注释的写法6. HTML文档的基本结构和布局7. HTML中常用的元素和属性二、CSS基础知识1. CSS是什么，它的作用和用途2. CSS的基本语法和结构3. CSS的选择器和选择器的种类4. CSS的样式和样式的应用5. CSS的盒模型和盒模型的属性6. CSS的浮动和定位7. CSS的布局和布局的种类8. CSS的颜色和背景9. CSS的文本和字体10. CSS的边框和边框的样式11. CSS的过渡和动画12. CSS的响应式设计三、JavaScript基础知识1. JavaScript是什么，它的作用和用途2. JavaScript的基本语法和结构3. JavaScript的变量和数据类型4. JavaScript的运算符和表达式5. JavaScript的流程控制和条件语句6. JavaScript的数组和对象7. JavaScript的函数和作用域8. JavaScript的事件和事件的处理9. JavaScript的DOM操作和DOM的结构10. JavaScript的定时器和动画四、响应式设计1. 什么是响应式设计，它的作用和用途2. 响应式设计的基本原理和实现方式3. 媒体查询和媒体查询的语法4. 移动端设计和移动端适配5. 响应式图片和响应式视频五、网页优化1. 什么是网页优化，它的作用和用途2. 网页加载速度的优化和优化的方法3. 图片和视频的优化和优化的技巧4. 脚本和样式的加载优化和优化的策略六、网页安全1. 网页安全的基本概念和作用2. XSS攻击和防范3. CSRF攻击和防范4. SQL注入和防范5. 网络劫持和防范以上就是网页设计期末考试的基本知识点总结，希望对大家有所帮助。
教学课件 HTML+CSS+JavaScript网页设计
本章概述 本章的学习目标 主要内容
Hale Waihona Puke 第1页本章概述• 随着互联网的发展，越来越多的人学会了上网，通过网络，可以 聊天、购物、看新闻、查天气等等。这些功能都是通过访问不同 的网页来完成的，那么网页是怎么制作出来的，我们通过手机、 电脑上网时又如何访问不同的网页呢？本章将从最基本的概念讲 起，告诉读者网页与网站的基本原理，如何设计和开发网页。
第4页
1.1 网页的基本概念
• 随着Internet的不断发展，网页已经被越来越多的人所熟悉。那么 什么是网页，网页有是如何搭建并呈现在用户面前的呢？
• Internet，中文正式译名为因特网，又叫做国际互联网。Internet 采用超文本和超媒体的信息组织方式，将信息的链接扩展到整个 Internet上。
• HTML是最早的超文本标记语言，它的发展经历了HTML 1.0、2.0、3.2、4.0、 4.01和5几个版本，在发展过程这，尤其是从HTML4.0开始淘汰了很多标记和 属性，本书对这些淘汰的标记和属性不再赘述。
第12页
CSS层叠样式表
• 层叠样式表是一种用来表现HTML或XML等文件样式的计算机语言。CSS不仅 可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格 式化。
第11页
HTML概述
• HTML的全称是超文本标记语言(Hyper Text Markup Language)，是Internet上用 于编写网页的主要语言，它提供了精简而有力的文件定义，可以设计出多姿 多彩的超媒体文件。
• HTML文件是纯文本的文件格式，所谓的超文本，主要是指它的超链接功能， 通过超链接将图片、声音和影视及其他网页或其他网站链接起来，构成内容 丰富的Web页面。
《WEB前端开发课件-HTML+CSS+JavaScript》
一门全面的课程，涵盖了 HTML、CSS 和 JavaScript 的基础语法、元素、表单、 图像、视频和音频的处理，以及 CSS 盒模型、定位和浮动的技巧。学习 JavaScript 的基础语法、数据类型、函数和面向对象编程，以及 DOM 操作、 AJAX 技术和 Web 安全与性能优化。
HTML表单
表单元素
• 输入框 • 下拉框 • 单选框 • 复选框
表单验证
• 必填字段 • 格式验证 • 自定义验证规则
提交和处理表单数据
使用服务器端脚本或 JavaScript 进 行表单数据的处理和验证。
HTML图像、视频和音频
图片标签
在网页中插入图片，并设置属性。
视频标签
嵌入视频，支持多种格式。
HTML基础语法
1 结构化标记
使用标签和元素创建网页结 构。
2 文本格式化
使用标题、段落和列表等标 签格式化文本内容。
3 超链接
创建与其他页面或资源的链接。
HTML元素和标签
1
块级元素
div、p、h1 等。
内联元素
2
span、a、img 等。
3
语义化标签
section、header、footer 等。
• 压缩和合并文件 • 浏览器缓存 • 响应式图片
HTTPS和内容安全策 略
使用 HTTPS 和内容安全策略保护 网站安全。
异步请求
使用 AJAX 发送异步请求并处理响 应。
JSON数据
使用 JSON 格式传输和解析数据。
XMLHttpRequest
使用 XMLHttpRequest 对象进行数 据交互。
网页设计代码知识点
网页设计代码知识点在现代社会中，网页设计是一个非常重要的领域。
随着互联网的普及和发展，越来越多的企业、组织和个人都需要拥有自己的网页来展示信息、推广产品或者提供服务。
而要完成一个优秀的网页设计，掌握相关的代码知识是非常必要的。
本文将为您介绍一些常用的网页设计代码知识点。
一、HTML基础知识HTML（Hyper Text Markup Language）是网页设计的基础语言，掌握HTML知识对于进行网页设计至关重要。
以下是一些HTML的基础知识点：1. HTML标签：HTML网页由一系列的HTML标签组成，标签用于定义网页中的各种元素，如标题、段落、链接等。
2. HTML元素：HTML标签包裹的内容称为HTML元素，一个HTML元素通常由开始标签和结束标签组成，开始标签用于定义元素的起始位置，结束标签用于定义元素的结束位置。
3. 常用HTML标签：常用的HTML标签包括`<div>`、`<p>`、`<a>`、`<img>`等等，每个标签都有不同的作用，可以根据网页设计需求来选择合适的标签。
二、CSS样式知识CSS（Cascading Style Sheets）用于控制网页的样式和布局，通过使用CSS，可以实现各种各样的网页效果。
以下是一些CSS样式知识点：1. CSS选择器：CSS选择器用于选择网页中的元素，并为其应用样式。
常见的选择器有标签选择器、类选择器、ID选择器等。
2. CSS属性：CSS属性用于定义元素的样式，如颜色、字体、边框等。
常见的CSS属性有`color`、`font-size`、`border`等。
3. CSS布局：CSS可以用于对网页进行布局和定位，通过使用各种CSS属性，可以实现网页的自适应和响应式布局。
三、JavaScript交互知识JavaScript是一种脚本语言，可以用于实现网页的交互效果和动态功能。
以下是一些JavaScript交互知识点：1. JavaScript语法：JavaScript语法类似于其他编程语言，包括变量、条件语句、循环语句等，可以实现复杂的逻辑处理。
Web前端开发课件：HTML、CSS、JavaScript基础
2
以及Ajax优势。
学习创建、配置和使用
XMLHttpRequest对象来向服务器请
求数据和响应客户端。
3
响应处理
如何处理服务器的响应，以便更好地 交互和更快地更新页面
网站开发架构和区分前后端处理
开放式Web架构
详细解释开放式Web架构 的概念，包括数据存储和 传输，以及Web资源之间 的交互方式。
SEO基础（搜索引擎优化）
1
了解SEO
基础SEO知识,包括如何从搜做引擎的
搜索引擎优化
2
角度思考网站设计。
通过内容、元数据、链接和用户体验
来优化您的网站，以提高其排名。
3
其他优化技巧
一些其他优化技巧，例如通过社交媒 体和博客网站来引擎流量。
Web安全基础和防范措施
安全问题
所涉及的威胁以及可能感 到担忧的位置。
Web前端开发课件
本课程将涵盖HTML、CSS和JavaScript的基础知识，帮助您入门Web开发。 从基础语法开始，内容丰富、易于理解。
程序员入门指南
编程语言
选择一门适合你的编程语 言并针对该语言的知识进 行学习。
计算机基础
学习计算机基础，包括数 据结构、Байду номын сангаас法、操作系统 和网络基础知识。
实践项目
选择器和操作
使用jQuery选择器来操作 HTML元素，并使用方法来执 行更复杂的操作。
事件处理
jQuery的事件处理器可以进行 更简化你常规的事件处理。
Ajax基础知识、XMLHttpRequest对象的 使用
1
Ajax基础知识
了解什么是Ajax以及为什么要使用它，
XMLHttpRequest对象的使用
web前端开发基础代码
web前端开发基础代码Web前端开发是一门涉及网页设计和构建的技术。
它是构建和维护网站的关键步骤之一。
一名优秀的Web前端开发人员需要精通各种编程语言和技术，并利用这些知识来创建出令人印象深刻的网站和应用程序。
本文将深入探讨Web前端开发的基础代码，包括HTML、CSS和JavaScript。
让我们从HTML开始。
HTML，即超文本标记语言，是构建网页的基础。
它通过使用标签来定义和组织网页的内容。
使用```<h1>```标签可以定义一个一级标题，```<p>```标签可以定义一个段落。
HTML标签提供了许多不同的功能，如图像插入、链接和表单等。
接下来是CSS，即层叠样式表。
CSS可以用来控制网页的外观和布局。
它通过定义样式规则来选择和设计网页元素。
可以使用CSS来设置标题的颜色和字体样式，或调整段落的间距和边框。
CSS还可以使用层叠和继承的概念来管理样式的优先级和应用范围。
最后是JavaScript，一种用于为网页添加交互性和动态功能的脚本语言。
JavaScript可以处理用户的输入，并根据其行为更改网页内容。
可以使用JavaScript创建交互式表单验证，或者在用户点击按钮时显示隐藏的内容。
JavaScript还可以与后端服务器进行通信，并根据服务器的响应更新网页。
Web前端开发的基础代码包括HTML、CSS和JavaScript。
这些技术共同为开发人员提供了丰富的工具和功能，以创建出令人惊叹的网站。
当您熟悉这些基础代码并深入理解它们的工作原理时，您将能够更好地掌握Web前端开发，并在实际应用中发挥更大的创造力。
对于我个人而言，我认为Web前端开发基础代码具有巨大的潜力和重要性。
通过熟练掌握这些技术，我可以将自己的创意和想法转化为实际可见的网页。
这不仅让我感到充满成就感，还让我能够与用户互动，并为他们提供优秀的用户体验。
Web前端开发的基础代码还为我打开了进一步学习和探索更高级技术的大门。
HTML+CSS+JS入门基础ppt
2.2.7 超级链接
超级链接是用锚元素<a>定义的 • 在<a>元素下，有元素属性href,href的属性值为一
个URL地址
➢ 如：<a href="/eschool">指向 学院的超级链接</a>
➢ 如：<a href="top.htm">普通超级链接</a> ➢ 如：<a href="../pic/left.htm">普通超级链接</a>
• 空格标记
2.2.5 水平线标记
• 水平线
<hr size = #>：设定线宽 <hr width=#>：设定线长 <hr align=#>：设定对齐方式 #=left, right <hr color=#> ：设定线的颜色
• <hr size=7 align=center width="75%" color="red">
2.1.3 HTML 文档结构-(head)meta
• 编写一个网页，要求3秒钟后自动跳转到北软教育首页。
• <html>
•
<head>
•
<title>my first page</title>
• <meta http-equiv="refresh" content="3;URL=">
网页设计与制作知识点梳理
网页设计与制作知识点梳理一、概述在当今信息化时代，网页设计与制作成为了一个热门的职业选择。
网页设计与制作是指通过使用HTML、CSS、JavaScript等技术，设计并制作出具有良好用户体验的适应各种设备和浏览器的网页。
本文将从网页设计与制作的基础知识、前端开发技术、用户体验等方面，对相关知识点进行梳理。
二、网页设计与制作基础知识1. HTML基础HTML是网页的核心语言，了解HTML的基本标签、元素和属性是进行网页设计与制作的基础。
常用的HTML标签有`<html>`、`<head>`、`<body>`、`<div>`、`<p>`等，这些标签用于描述网页的结构和内容。
2. CSS基础CSS是用于网页样式设计的语言，通过CSS可以为网页添加背景、颜色、字体等样式。
熟悉CSS的选择器、样式属性和值的设置是进行网页美化的基础。
常见的CSS样式属性包括`color`、`font-size`、`background-color`、`margin`等。
3. JavaScript基础JavaScript是一种用于实现网页交互效果的脚本语言，掌握JavaScript的语法和常用的DOM操作可以实现对网页元素的动态修改和事件响应。
了解JavaScript的基础语法、变量、函数和常用的DOM 操作方法有助于提升网页的交互性和动态效果。
4. 响应式设计响应式设计是指根据不同设备和屏幕尺寸，为网页提供适配的布局和样式。
通过媒体查询、弹性布局等技术，可以使网页在不同设备上获得较好的展示效果。
响应式设计是现代网页设计与制作的常见要求。
三、前端开发技术1. jQueryjQuery是一个快速、简洁的JavaScript库，具有强大的DOM操作和事件处理能力。
掌握jQuery的使用可以简化网页开发过程，并提供丰富的插件和特效。
2. BootstrapBootstrap是一个用于设计和开发响应式网站的前端框架，提供了许多CSS和JavaScript组件，用于实现页面的布局和样式。
前端开发知识体系
前端开发知识体系一、HTML基础知识HTML是前端开发的基础，它是一种用于描述和定义网页结构的标记语言。
掌握HTML基础知识非常重要，包括HTML标签的概念、常用标签的用法、文本格式化、图片嵌入等。
此外，还需要了解HTML5的新特性，如语义化标签、表单验证、音视频播放等。
二、CSS基础知识CSS用于控制网页的样式和布局，是前端开发中不可或缺的一部分。
掌握CSS基础知识包括选择器、样式属性、盒模型、浮动、定位等。
此外，还需要了解CSS3的新特性，如过渡、动画、阴影效果等。
三、JavaScript基础知识JavaScript是一种脚本语言，用于实现网页的动态效果和交互功能。
掌握JavaScript基础知识包括变量、数据类型、运算符、流程控制、函数等。
此外，还需要了解ES6的新特性，如箭头函数、模块化、异步编程等。
四、前端框架和库前端框架和库可以提高开发效率，使前端开发更加便捷。
常见的前端框架有React、Vue和Angular，它们都提供了一套完整的解决方案，包括组件化、路由管理、状态管理等。
此外，还有一些常用的前端库，如jQuery、Lodash等，它们提供了一些常用的工具函数和方法。
五、前端工程化前端工程化是指使用一系列的工具和技术，将前端开发过程进行规范化和自动化。
掌握前端工程化知识包括构建工具、模块打包、代码规范、自动化测试等。
常见的前端工程化工具有Webpack、Gulp 和Grunt，它们可以帮助我们自动化处理资源文件、优化代码、提升性能等。
六、响应式设计和移动端开发随着移动互联网的发展，移动端开发变得越来越重要。
掌握响应式设计和移动端开发知识包括媒体查询、REM布局、移动端调试等。
此外，还需要了解一些常用的移动端开发框架，如React Native、Flutter等，它们可以帮助我们快速开发跨平台的移动应用。
七、性能优化和页面加载速度优化网页的性能和页面加载速度对于提升用户体验非常重要。
前端工程师需要掌握的技能
前端工程师需要掌握的技能随着互联网的发展，前端工程师的需求逐渐增加。
前端工程师是构建用户界面的关键角色，他们负责实现设计师的概念，并确保用户在浏览网页时获得良好的用户体验。
然而，成为一名优秀的前端工程师并非易事，需要掌握一系列的技能。
本文将介绍前端工程师需要掌握的技能，以帮助那些希望从事这个领域的人。
1. HTML和CSS基础知识HTML和CSS是前端开发的基础，前端工程师必须对它们有深入的了解。
HTML用于描述网页的结构，而CSS用于控制网页的样式。
掌握HTML和CSS可以帮助前端工程师准确地实现设计师的要求，并创建可访问性强、易维护的网页。
2. JavaScript编程能力JavaScript是一种广泛使用的脚本语言，用于为网页添加动态功能和交互性。
前端工程师需要熟练掌握JavaScript，并了解其最新的特性和框架。
通过使用JavaScript，前端工程师可以创建交互式的用户界面，处理用户输入并与后端进行数据交互。
3. 响应式设计和移动端开发随着移动互联网的普及，移动端开发已成为前端工程师必备的技能。
前端工程师需要了解响应式设计的原理和实践，以确保网页在不同设备上都能正常显示。
此外，熟悉移动端开发的技术如React Native、Flutter等也是有利的。
4. 前端框架和工具前端框架和工具可以帮助前端工程师更高效地开发和管理代码。
目前，最流行的前端框架包括React、Vue和Angular。
掌握这些框架的使用方法，可以提高代码的复用性和可维护性。
此外，熟悉版本控制工具如Git也是必不可少的。
5. 浏览器开发工具和调试技巧在前端开发过程中，调试是不可避免的。
前端工程师需要熟悉浏览器开发工具，如Chrome开发者工具，以辅助调试代码、分析性能问题等。
掌握一些调试技巧，如断点调试、日志输出等，可以提高开发效率。
6. 性能优化和网页加载速度在今天的高速互联网环境下，用户对网页加载速度的要求越来越高。
前端基础简答题
前端基础简答题1.HTML是什么？它的作用是什么？HTML是超文本标记语言的简称，是一种用于创建网页的标准标记语言。
它用于描述网页的结构和内容，包括标题、段落、列表、链接、图片等元素。
HTML文件以.html或.htm为扩展名，通常使用文本编辑器编写。
2.CSS是什么？它的作用是什么？CSS是层叠样式表的简称，是一种用于描述HTML或XML（包括如SVG、MathML等衍生技术）文档样式的样式表语言。
CSS用于描述文档的视觉表现，包括字体、间距、颜色、边距等布局和设计的样式。
CSS可以使网页更具美观性和用户体验。
3.JavaScript是什么？它的作用是什么？JavaScript是一种脚本语言，用于在浏览器中实现交互性和动态功能。
它可以直接在浏览器中运行，不需要服务器端的支持。
JavaScript可以用于实现网页上的各种交互效果，如表单验证、动态内容更新、动画效果等。
它是前端开发中非常重要的语言之一。
4.什么是DOM？它的作用是什么？DOM是文档对象模型的简称，是一种表示和交互HTML或XML文档结构的接口。
DOM将文档结构化为一个对象树，每个节点都是一个对象，可以对其进行读取、修改和添加新元素等操作。
DOM使得JavaScript能够动态地更改页面的内容和结构，实现各种交互效果。
5.什么是HTTP？它的工作原理是什么？HTTP是超文本传输协议的简称，是一种应用层协议。
它用于在网络中传输超文本（如网页），是互联网中最为广泛和基础的通信协议之一。
HTTP协议基于请求/响应模型，客户端向服务器发送请求，服务器返回响应。
HTTP协议具有无连接、无状态、无重传等特点，使得互联网中的信息传输更加高效和可靠。
网页设计技术知识点
网页设计技术知识点一、HTML基础知识HTML（超文本标记语言）是构建网页的基础语言，熟悉HTML的基础知识是进行网页设计的必备条件。
1. HTML标签HTML使用标签来定义网页的结构和内容。
常见的HTML标签包括：- `<html>`：定义HTML文档- `<head>`：定义文档的头部信息- `<title>`：定义文档的标题- `<body>`：定义文档的主体内容2. HTML元素HTML标签可以包含内容，这些包含在标签内的内容称为HTML元素。
常见的HTML元素包括：- `<h1>`至`<h6>`：定义标题- `<p>`：定义段落- `<a>`：定义链接- `<img>`：定义图像- `<ul>`和`<li>`：定义无序列表3. HTML属性HTML标签可以拥有属性，属性为元素提供额外的信息。
常见的HTML属性包括：- `id`：定义元素的唯一标识符- `class`：定义元素的类名- `src`：定义图像的源路径- `href`：定义链接的目标地址二、CSS样式与布局CSS（层叠样式表）用于定义网页的外观和布局，掌握CSS的使用可以使网页更加具有吸引力和易读性。
1. CSS选择器CSS选择器用于选择需要样式化的HTML元素。
常见的CSS选择器包括：- 元素选择器：如`p`选择所有段落元素- 类选择器：如`.container`选择类名为container的元素- id选择器：如`#header`选择id为header的元素2. CSS样式属性CSS样式属性用于设置元素的外观，常见的CSS样式属性包括：- `color`：设置文本颜色- `font-size`：设置文字大小- `background-color`：设置背景颜色- `margin`和`padding`：设置元素的边距和内边距3. CSS布局技巧- 相对定位（`position: relative`）：相对于元素原本所在位置进行定位- 绝对定位（`position: absolute`）：相对于最近的具有相对或绝对定位的父元素进行定位- 浮动（`float`）：使元素脱离文档流，使其他内容围绕其周围布局三、响应式设计与移动优先随着移动设备的普及，网页设计需注重响应式设计和移动优先的原则，以适应不同屏幕尺寸的设备。
静态网页设计知识点
静态网页设计知识点静态网页设计是指通过HTML、CSS等静态技术手段来构建网页的过程。
在静态网页设计中，我们需要掌握一些关键的知识点，以确保所设计的网页既具备美观的外观，又具备良好的用户体验。
本文将重点介绍一些静态网页设计的知识点，以帮助读者更好地理解和运用这些技术。
一、HTML基础知识1. HTML基本结构：HTML网页一般由<!DOCTYPE>声明、<html>标签、<head>标签和<body>标签组成。
2. 标题与段落：使用<h1>至<h6>标签定义标题，使用<p>标签定义段落。
3. 图片与链接：使用<img>标签插入图片，使用<a>标签创建链接。
4. 列表与表格：使用<ul>、<ol>和<li>标签定义无序和有序列表，使用<table>、<th>和<td>标签创建表格。
二、CSS样式设计1. CSS选择器：针对HTML元素的不同属性和结构进行选取，可以使用标签名、类名、ID等不同类型的选择器。
2. 字体与颜色：使用font-family属性定义字体样式，使用color属性定义文字颜色。
3. 背景与边框：使用background属性定义背景颜色或背景图片，使用border属性定义边框样式。
4. 盒模型：了解盒模型的概念和属性，包括margin、padding、border和content。
5. 浮动与定位：使用float属性定义元素的浮动方式，使用position属性定义元素的定位方式。
三、响应式设计与布局1. 媒体查询：利用CSS的@media规则，根据设备的屏幕尺寸和特征，为不同的屏幕设备提供不同的布局和样式。
2. 弹性盒子布局：使用CSS的flex属性，实现弹性的页面布局和定位。
3. 栅格系统：借助CSS框架（如Bootstrap），通过定义栅格来实现网页的自适应布局。
web前端的基础语言
web前端的基础语言Web前端的基础语言主要包括HTML、CSS和JavaScript。
这三种语言是构建网页的基础，相互配合使用可以实现丰富多样的网页效果。
下面将分别介绍这三种语言的特点和基本用法。
一、HTML（超文本标记语言）是构建网页的基础。
它是一种标记语言，通过使用不同的标签来描述网页中的各个元素。
HTML标签使用尖括号包裹，具有开标签和闭标签之分。
HTML标签主要用来描述网页的结构和内容，比如标题、段落、列表、链接、图像等。
通过使用不同的标签，可以将文本、图片、音频、视频等元素添加到网页中。
除此之外，HTML还可以设置网页的样式、布局和表单等。
二、CSS（层叠样式表）用于控制网页的样式。
CSS可以选择HTML元素，并为其添加样式属性，比如颜色、背景、字体等。
通过CSS，可以改变网页的外观和布局，使其更加美观和易于阅读。
CSS的语法由选择器和声明组成。
选择器用于选择要应用样式的HTML元素，而声明则包含了要应用的样式属性和值。
使用CSS，可以实现网页的排版、样式和动画效果等。
三、JavaScript是一种脚本语言，可以为网页添加交互和动态效果。
通过JavaScript，可以对网页的元素进行操作、响应用户的事件、改变网页的内容和样式等。
JavaScript可以与HTML和CSS相互配合使用，实现更加丰富的网页功能。
它可以通过DOM（文档对象模型）来操作网页的元素，通过事件来响应用户的操作，通过AJAX来进行数据的异步传输。
除了HTML、CSS和JavaScript，还有一些其他的前端技术和框架，比如jQuery、React、Angular等。
它们可以进一步简化前端开发的过程，提高开发效率。
总结一下，Web前端的基础语言主要包括HTML、CSS和JavaScript。
它们分别用来描述网页的结构、控制网页的样式和实现网页的交互。
掌握这三种语言的基本用法，可以构建出美观、功能丰富的网页。
同时，还可以学习一些其他的前端技术和框架，进一步提升自己的开发能力。
web前端开发专业知识技能
web前端开发专业知识技能Web前端开发是指通过使用HTML、CSS和JavaScript等技术，构建用户在网页浏览器中直接交互的部分。
下面是Web前端开发所需的一些专业知识和技能：1.HTML（超文本标记语言）：理解HTML的基础语法，能够创建语义化的文档结构，包括页面的标题、段落、列表、表格等。
2.CSS（层叠样式表）：掌握CSS的基本概念，能够选择器、样式规则、布局和响应式设计，实现页面的样式美化和布局。
3.JavaScript：精通JavaScript语言，包括数据类型、函数、面向对象编程等。
了解异步编程、闭包、原型链等概念，能够处理DOM操作、事件处理和表单验证等。
4.前端框架和库：学习掌握流行的前端框架和库，如React、Vue.js、Angular等，以提高开发效率和维护性。
5.版本控制系统：使用版本控制工具，例如Git，进行团队协作和代码管理。
6.包管理工具：掌握npm或者Yarn等包管理工具，用于安装和管理前端项目的依赖包。
7.前端构建工具：了解并使用构建工具，如Webpack、Parcel等，以优化和打包前端项目。
8.AJAX（异步JavaScript和XML）：掌握AJAX技术，能够实现异步数据请求和处理。
9.RESTfulAPI：了解RESTfulAPI的设计原则和使用，与后端进行数据交互。
10.跨浏览器兼容性：-能够解决不同浏览器兼容性问题，确保网站在各种浏览器中都能正确显示和运行。
11.移动端开发：-了解移动端开发的基本原理，能够创建响应式设计的网页或使用框架进行移动端开发。
12.性能优化：-学会优化前端性能，包括减少HTTP请求、压缩和合并文件、使用CDN等。
13.测试和调试：-掌握前端测试工具，如Jest、Mocha等，并能够使用浏览器开发者工具进行调试。
14.前端安全：-了解前端安全的基本原则，包括防止XSS（跨站脚本攻击）和CSRF（跨站请求伪造）等。
15.学习能力和沟通技能：-具备快速学习新技术和解决问题的能力，同时良好的沟通技能有助于与团队成员和其他相关部门有效合作。
前端开发知识点
前端开发知识点前端开发是指通过使用HTML、CSS和JavaScript等技术，为用户提供优秀的网站体验。
以下是前端开发的主要知识点：1. HTML：HTML是超文本标记语言，用于描述网页的结构和内容。
学习HTML需要了解标签、属性、表单等基本概念。
2. CSS：CSS是层叠样式表，用于控制网页的样式和布局。
学习CSS需要了解选择器、盒模型、浮动等基本概念。
3. JavaScript：JavaScript是一种脚本语言，用于实现动态交互效果。
学习JavaScript需要了解变量、函数、事件等基本概念。
4. jQuery：jQuery是一个流行的JavaScript库，简化了DOM操作和事件处理等常见任务。
学习jQuery需要掌握选择器、事件处理、动画效果等基本概念。
5. Bootstrap：Bootstrap是一个流行的前端框架，提供了响应式布局和常见UI组件等功能。
学习Bootstrap需要掌握栅格系统、组件使用等基本概念。
6. AJAX：AJAX是一种使用JavaScript实现异步通信的技术，可以在不刷新页面的情况下更新部分内容。
学习AJAX需要了解XMLHttpRequest对象和回调函数等基本概念。
7. Vue.js：Vue.js是一个流行的前端框架，提供了组件化开发和响应式数据绑定等功能。
学习Vue.js需要掌握组件生命周期、数据绑定等基本概念。
8. React：React是另一个流行的前端框架，使用虚拟DOM实现高效的UI渲染。
学习React需要掌握组件开发、状态管理等基本概念。
9. Webpack：Webpack是一个流行的前端构建工具，可以将多个模块打包成单个文件，并且支持代码压缩和优化等功能。
学习Webpack 需要了解配置文件、插件使用等基本概念。
10. 浏览器兼容性：不同浏览器对HTML、CSS和JavaScript的支持程度有所不同，前端开发者需要了解不同浏览器的特点，并编写兼容性代码。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
1.web概述1)web三要素(B/S架构)浏览器(B)代理作用,向服务器发送请求,服务器返回一个.html格式的文件,浏览器(渲染)解释执行文件(页面)服务器(S)接收浏览器的请求,做出相应的处理,响应一个页面HTTP协议通讯协议2)常用的浏览器IE,FireFox,Chrome,Safari,Opera3)html工作原理html文件部署在服务器端html页面运行在浏览器中浏览器发送请求,服务器接收请求,响应一个页面,然后浏览器渲染内容2.HTML概述1)什么是html(Hyper Text MarkUp Language)超文本标记语言是一种用来设计网页的标记语言,用该语言编写的文件,后缀为.html或.htm,由浏览器解释执行,生成相应的页面2)head元素主要用于描述页面数据<meta>,<title>,<link>,<style>,<script>...1>title元素主要用来显示当前页面的标题2>meta元素主要用来定义页面元数据和消息头<meta http-equiv="Content-Type"content="text/html; charset=UTF-8" />http-equiv消息头content消息内容消息头：浏览器向服务器发送请求,服务器返回一些键值对页面刷新参照-->页面刷新.html3)body元素显示页面的数据(内容)内容实体转义：'---'"---"<---<>--->&---&空格--- 1>分区元素div元素和span元素div元素：块级元素，独占一行(元素前后会自动换行),可以设置宽高span元素：行内元素，不会独占一行，设置宽高无效2>文本标题元素<h1>~<h6><h1></h1><h2></h2><h6></h6>h1字体最大,h6字体最小3>段落元素<p></p>特点：行于行之间有空白的段落间距4>列表元素有序列表<ol></ol>无序列表<ul></ul>列表项<li></li>注意：列表只能写列表项<li>,列表项中输出文本内容嵌套列表5>图片元素<img src="" width="" height=""/>必要的属性：src(URI)常用的属性：width,height 6>超链接元素<a href="" target=""></a>必要的属性：href(URL/URI)常用的属性：target 取值_blank(打开新的窗口),_self(在自身的窗口打开链接)等等锚点：利用a元素的name属性定义一个锚点<a name="mark"></a>超链接连接到锚点#告诉浏览器跳转不是一个链接,而是一个内部位置<a href="#mark">回到Mark位置</a>发送邮件:<a href="mailto:邮箱地址?subject=hello&body=尊敬的学码思:">发送邮件</a>//outlook,foxmail7>表格table表格通常用来组织结构化的信息table元素：定义(创建)表格属性：boder边框，默认值0，单位是像素pxcellpadding单元格与内容之间的垂直间距cellspacing单元格与单元格之间的间距align水平方向居左left(默认值)/居右right/居中centerwidthheighttr元素：创建行属性：align水平位置(left,center,right)valign垂直位置(top,middle,bottom)td元素：创建列(单元格,存放数据)属性：align水平位置valign垂直位置widthheightcolspan跨列属性rowspan跨行属性完整的表格表格的标题：<caption></caption>位于table第一行行分组：将多个行分为一组<thead></thead><tbody></tbody><tfoot></tfoot>提示：<thead>和<tfoot>只能出现一次,<tbody>可以出现多次8>表单form<form action="" method="" enctype="">input标记非input标记</form>action属性：表单提交之后哪一个程序处理method属性：表单提交的方式enctype属性：设置表单的MIME编码表单控件：文本框：<input type="text" name="username" value="张三"/>name属性：标记的一个名称,该名称用于生成一个请求参数, 如果没有命名,则浏览器不会该数据发送给服务器value属性：文本框内容密码框：<input type="password" name="" value=""/>单选框：<input type="radio" name="sex" value="男" checked/>男<input type="radio" name="sex" value="女"/>女name属性：标记的一个名称,该名称用于生成一个请求参数, 如果没有命名,则浏览器不会该数据发送给服务器,分组效果checked属性：选中复选框：<input type="checkbox" name="" value=""/>name属性：同上checked属性：选中隐藏域：<input type="hidden" name="" value=""/>文件上传：<input type="file" name=""/>普通按钮：<input type="button" value="普通按钮"/>重置按钮：<input type="reset" value="重置按钮"/>恢复到页面加载的最初状态提交按钮：<input type="submit" value="提交按钮"/>把form表单的数据提交给action指定的程序处理下拉框：<select name="" multiple><option value="nj">南京</option><option value="sh">上海</option><option value="bj">北京</option></select> name属性：设置参数名，同上value属性：设置参数值multiple属性：可以使用单选下拉框变成多选下拉框文本域：<textarea name="" rows="5" cols="5"></textarea>1.css简介css指层叠样式表(Cascading Style Sheets)1)css使用方式1>内联方式<p style="color:red;width:200px;height:200px;">段落元素</p> 2>内部方式<head><style>p{color:red;width:200px;height:200px;}</style></head>3>外部方式<head><link type="text/css" rel="stylesheet"href="css/外部的css.css" /></head>CSS文件后缀名为.css2)CSS语法规范css由多个样式规则组成,每个样式规则有两部分：选择器和样式声明样式声明：样式名和样式值例如：p{color:red}css的特性：继承性：子元素可以继承父元素的样式层叠性：子元素继承父元素不冲突的样式或者自身多个不冲突的样式是可以层叠的优先级：子元素继承父元素有冲突的样式或者自身多个冲突的样式,需要考虑优先级优先级从高到低：内联方式,内部方式或外部方式(就近原则),浏览器默认的样式3)选择器1>元素选择器table{boder:1px double red;}2>类选择器<div class="dclass">内容</div> <p class="dclass">内容</p>匿名类选择器.dclass{color:red;}有名字的类选择器div.dclass{color:blue;}3>ID选择器注意：ID属性值为唯一的<div id="did">内容</div>#did{color:red;}4>分组选择器将多个选择器用逗号隔开分成一组div,.cl,#d1,p{color:blue;}5>派生选择器子元素选择器：p>strong{color:red}后代元素选择器：p strong{color:red}选择器优先级：ID选择器(有名字的ID选择器>匿名的ID选择器)>类选择器(有名字的类选择器>匿名的类选择器)>派生选择器>元素选择器注意：操作同一个目标元素加载样式,相同的选择器需要考虑就近原则,不同的选择器不需要考虑就近原则,需要考虑选择器优先级6>伪劣(伪类)选择器伪类选择器用于设置同一个元素在不同状态下的样式:link 向未被访问的超链接添加样式:visited 向已被访问的超链接添加样式:active 向被激活的元素添加样式(左键按下去没有松开):hover 当鼠标悬浮至元素上面时添加样式:focus 当元素获取焦点时添加样式4)CSS声明1>盒子模型(box model)作用：元素边框和其内容间距以及与其他元素边框之间的间距(用于布局)padding:内边距padding:30px;上下左右间距30px(以上左为准)padding:10px 20px;上下左右padding: 1px 2px 3px 4px;上右下左(顺时针)padding-left/right/top/buttom:10px;盒子最终宽和高：内边距(padding)+宽(width)和高(height)margin:外边距margin:0 auto;//水平方向居中2>边框borderborder:宽度值样式值颜色值;border:1px solid red;border-width:1px;border-style:double;border-color:red;border-left/right/top/buttom:1px solid red;border-left-width:1px;border-left-style:double;border-left-color:red;3>宽和高(尺寸相关)width,height样式尺寸单位：px像素(相对单位)pt磅(绝对单位)%百分比in英寸cm厘米mm毫米overflow声明overflow:visible/hidden/scroll(不管是否溢出都会出现滚动条)/auto(只有溢出才会出现滚动条)样式颜色取值：a.英文颜色单词red,blue,green...b.十六进制表示颜色#000000#FFFFFF#fff(简写)c.rgb值rgb(0,0,0)rgb(255,255,255)rgb(0%,0%,0%)rgb(100%,100%,100%)4>背景设置参照day02/背景设置.html5>文本设置参照day02/文本设置.html6>表格设置参照day02/表格设置.html7>浮动参照day02/浮动.html8>列表参照day02/列表.html(重点导航栏)9>显示方式display参照day02/显示方式.html10>定位(布局)position1.JavaScript概述1>什么是JavaScript?JavaScript是一种网页编程技术,用来向HTML页面添加交互行为JavaScript还是一种基于对象和事件驱动的解释性脚本语言,具有JAVA和C语言类似的语法直接嵌入到HTML页面中浏览器解释执行代码,不进行预编译2>JavaScript的特点a.可以使用任何文本编辑工具编写,只需要浏览器就可以执行程序b.解释执行：事先不进行编译,逐行执行代码c.基于对象：内置大量现成对象适用的场景：--客户端数据计算--客户端表单的合法性验证--浏览器事件的触发--网页特殊显示效果制作--Ajax(异步请求)3>第一个JavaScript程序1>事件定义方式在定义事件时直接写入JS脚本2>嵌入方式在页面上嵌入<script></script>标签标签中放置JS代码3>文件调用方式将JS代码写入一个单独的文件,并保存为.js后缀外部文件不能包含<script>标签HTML页面中<head>标签中引入外部文件(.js文件)2.JavaScript基本语法1>编写JS代码由Unicode字符集编写注释：单行://多行:/* */语句：表达式,关键字,运算符组成大小写敏感使用分号或者换行结束2>常量,标识符,关键字常量：直接在程序中出现的数据值标识符：不能以数字开头的字母,数字,下划线,美元符组成常用于表示函数,变量等的名称关键字：function,if,break...3>变量var 变量名;//声明一个变量a.变量声明使用关键字var声明变量b.变量初始化使用= 赋值var a = 1;//数值类型a = '1';//字符串类型var b;没有初始化的变量则自动取值undefined(未定义)4>数据类型a.基本类型Number:数值表示整型或浮点型数值number对应的封装类(包装类)NumberNumber.MAX_VALUE最大值Number.MIN_VALUE最小值String:字符串string属于基本类型,没有char类型string对应的包装类StringBoolean:布尔取值true/falseb.特殊类型Null:空null在程序中代表"无值"或"无对象"可以通过赋值null来清空内容Undefined:未定义定义一个变量,没有初始化值,就取值undefinedc.复杂类型Array:数组Object:对象5>数据类型转换a.隐式转换JS是松散型的程序语言,变量在声明时不需要指定数据类型,变量的值是有类型的,不同类型的数据在计算中会自动转换字符串+ 数字：数字转换成字符串数字+ 布尔值：true=1,false=0字符串+ 布尔值：布尔值转换为字符串布尔值+ 布尔值：true=1,false=0b.显示转换toString():全部数据类型均可以转换为字符串parseInt():转换为整数,强转失败返回NaN(不是一个数字not a number)parseFloat():转换为浮点数,强转失败返回NaN(不是一个数字not a number)typeof():查询当前数据类型,返回number,string,object,undefined,function,boolean...例如：typeof('123')-->stirngvar a;typeof(a)-->undefinedisNaN():判断当前数据是不是不是一个数字true表示不是一个数字false表示是一个数字6>运算符数学运算符：+,-,*,/,%var a=1;a++;//1++a;//3a--;//3--a;//1比较运算符：>,>=,<,<=,==,!=,======全等:数据类型和数据内容都相等if(1=='1'){//true}if(1==='1'){//false}if(1===1){//true}逻辑运算符:||或&&并且(与)!非三元(三目)表达式:表达式1?表达式2:表达式3var a = '';if(a!=null||a!=''||a!=undefined)//不推荐if(a)//推荐表达式值布尔值0 false'' falsenull falseundefined falseNaN false'1' true2 true"非空"的值true3.JS对象概述JS包含很多的对象：内置对象,外部对象,自定义对象对象中有属性和方法对象.属性对象.方法()内置对象:1)String对象创建字符串对象有两种方式：var str = 'hello world';var str2 = new String("Hello World");String对象的属性：length长度String对象的方法：参照day03/字符串对象.html2)Number对象常用方法：toFixed(num):转换成字符串,四舍五入保留小数num 位,num取值0~20例如：var dataNum = 23.568;var dataStr = dataNum.toFixed(2);//23.573)Array对象创建数组对象：第一种方式：var arry = new Array();第二种方式：var ary = [];数组的长度是可以变化的参照day03/数组对象.html4)Math对象直接就可以使用Math.属性/方法参照day03/Math对象.html1.外部对象1)BOM(Browser Object Model)浏览器对象模型,用来访问和操作浏览器窗口window对象document文档对象history浏览器历史记录对象location窗口地址对象window对象常用的方法：alert(str)对话框confirm(str)确认框,点击确定返回true,其他返回falseprint()打印当前窗口信息open()打开新的窗口prompt()显示提示用户输入的对话框周期性定时器：window.setInterVal(fn,time);详细参照定时器.html一次性定时器：window.setTimeOut(fn,time);详细参照一次性定时器.html/*获取当前窗口的地址* 设置属性值,达到刷新效果*///window.location.href=window.location.href;/*刷新页面*/window.location.reload();2)DOM(Document Object Model)文档对象模型用来访问和操作节点树(文档树)删除节点,新增节点,修改节点信息,修改属性,删除属性,添加属性添加文本内容,清空文本内容等等查询节点：1>document.getElementById();通过元素中ID属性值查询元素忽略整个文档结构找不到返回null2>通过层次查询无法忽略整个文档结构parentNode:查询父节点childNodes:查询子节点previousSibling:查询前一个兄弟节点previousElementSibling:查询前一个兄弟元素nextSibling:查询下一个兄弟节点firstChild:查询第一个子节点lastChild:查询最后一个子节点3>通过标签名称document.getElementsByTagName();返回一个数组如果找不到,返回长度等于0的数组4>通过class属性获取元素document.getElementsByClassName();同上5>通过name属性获取元素document.getElementsByName();同上节点类型：nodename:节点名称元素节点和属性节点：标签名和属性名文本节点：#text文档节点：#document注释节点：#commentnodeType:节点类型元素节点：1属性节点：2文本节点：3注释节点：8文档节点：9nodeValue:节点内容属性值,null,文本内容,注释内容设置节点文本内容：innerText:设置或获取开始标签和结束标签内的文本innerHtml:设置和获取开始标签和结束标签内的HTML。