web前端笔记8-10

合集下载

渡一教育前端笔记

以下是一份渡一教育前端学习笔记，供您参考：1. HTML：HyperText Markup Language，超文本标记语言。

2. meta 标签：<meta charset="utf-8">，用于定义文档的字符编码。

utf-8 是万国码，包括所有国家的语言。

3. lang 属性：<html lang="en, ch">，用于标识语言，为爬虫而标识。

en：英文；ch：中文。

4. div 标签：一个区块级元素，用于组合文档中的块级元素。

5. onclick 属性：用于添加和移除事件处理程序。

可以在行间写 onclick='alert("a")'，也可以在外部通过 JavaScript 代码添加事件处理程序。

6. JavaScript：一种脚本语言，用于在浏览器中实现交互效果。

可以通过 window 对象来访问浏览器窗口及文档对象。

7. 事件处理程序：用于处理用户与页面交互时发生的事件，比如点击、鼠标移动等。

可以添加事件处理程序，处理用户与页面的交互。

8. 函数：可以用来封装一段代码，实现特定功能。

可以在JavaScript 中定义函数，并使用函数名来调用函数。

9. this 关键字：在事件处理程序中，this 指向触发事件的元素本身。

10. DOM：Document Object Model，文档对象模型。

HTML 中的每个元素都是一个DOM 对象，可以通过JavaScript 来访问和操作这些对象。

11. window 对象：浏览器窗口的代表，是 JavaScript 中最常用的对象之一。

可以通过 window 对象来访问浏览器窗口及文档对象。

12. alert() 函数：用于弹出一个带有指定消息和确定按钮的警告框。

以上是渡一教育前端学习笔记的主要内容，供您参考。

web前端基础开发笔记

01.HTML简介HTML(Hyper Text Mark-up Language超文本标记语言)，标记就是用来描述网页内容的一些特定符号，HTML不是编程语言，而是一种描述性的标记语言，用于描述网页中内容的显示方式，比如文字以什么颜色、大小来显示，这些都是利用HTML标记来实现的.HTML文档的创建方式: 用HTML语言创建的文档·手工直接编写(例如记事本)·通过图形化的HTML开发软件Dreamweaver·由Web服务器上的动态网页程序生成标记也称为标签或元素.02.HTML语法HTML最基本的语法是: <标记符>内容</标记符>标记符通常都是成对出现的，有一个开头标记和结束标记，结束标记只是在开头标记的前面加一个斜杠"/"，当浏览器打开html文件后，就会理解里面的标记符，然后把标记符对应的功能表达出来。

例如:<hr width="80%" /)<font size="7">文字内容</font>制作一个html网页文件:·新建一个记事本的文件，命名为*.html·在文件里面输入内容HTML标记的类型: 单标记与双标记·单标记: <标记名称>·单一型，无属性值: 如: <br />·单一型，有属性值: 如: <hr width="80%" />·双标记·无属性值: <标记名称>...</标记名称> 如: <title>...</title>·有属性值: <标记名称属性="属性值">...</标记名称> 如: <font size"7">...</font>说明:·标记与属性、属性之间以空格分隔·属性不区分先后顺序，且属性不是必需的.·虽然在HTML中标记不区分大小写，但在XHTML中所有标记都必须小写，所以建议所有标记都采用小写.03.HTML文档结构所有的网页文件，通常由四对标记来构成文档的骨架:<html><head><title>标题<title></head><body>正文</body></html>说明:·<html>...</html> 标识网页文件的开始与结束，所有的html元素都要放在这对标记中.·<head>...</head> 标识网页文件的头部信息，如标题、搜索引擎关键字等. ·<title>...</title> 标识网页文件的标题·<body>...</body> 标识网页文件的主体部分04.注释:注释格式: 05.头部(head)标记meta标记用于定义文件信息，对网页文件进行说明，便于搜索引擎查找。

Web前端笔记整理

Web前端笔记整理不使⽤Ajax⽆刷新提交：header('HTTP/1.1 204 No Content');var a=document.createElement('img'); a.setAttribute('src','./01.php');<form action="" target="regzone"></form> <iframe name="regzone" style="display:none"></iframe>Ajax处理XML：var xml = obj.responseXML.getElementsByTagName("city");var res = xml[0].childNodes[0].nodeValue;Ajax处理JSON：var res=eval("("+obj.responseText+")");alert();jQuery的Ajax处理JSON：var obj = JSON.parse(data);alert(er_id);jQuery的AJax操作：function ajaxGet(){$.ajax({type:"GET",url:"test.php?key=123",success:function(data){alert(data);}});}function ajaxPost(){$.ajax({type:"POST",url:"test.php",data:'{"id":1,"name":"abc"}',contentType:"application/json;charset=utf-8",success:function(data){alert(data);}})}【HTML】1.邮件链接：<a href="mailto:?subject=title">点击发送邮件</a>2.表格：单元格与单元格的间距cellspacing，单元格与内容间距cellpadding，跨⾏rowspan，跨列colspan。

web学习笔记(2021年整理精品文档)

web学习笔记编辑整理：尊敬的读者朋友们：这里是精品文档编辑中心，本文档内容是由我和我的同事精心编辑整理后发布的，发布之前我们对文中内容进行仔细校对，但是难免会有疏漏的地方，但是任然希望（web学习笔记）的内容能够给您的工作和学习带来便利。

同时也真诚的希望收到您的建议和反馈，这将是我们进步的源泉，前进的动力。

本文可编辑可修改，如果觉得对您有帮助请收藏以便随时查阅，最后祝您生活愉快业绩进步，以下为web学习笔记的全部内容。

1.<meta〉元信息标记，定义页面的关键字,页面说明，刷新等。

改变链接字的颜色<body link="未访问过的字颜色" vlink=”访问后的颜色" > 3.列表有序<ol〉〈type=“1"start=“3"〉<li></li></ol〉无序<ul〉〈type="square”><li>名称〈li〉</ul>目录〈dir><li>名称〈/li><dir>菜单<menu〉〈li>名称〈/li〉</menu>定义列表〈dl〉<dt〉定义〈/dt〉〈dd〉定义的内容</dd></dl〉4.<sub〉上标和〈sup>下标5。

<vspace="”〉垂直边距，用于图文混排6.〈b></b>加粗<i>〈/i>斜体7.利用<caption〉</caption〉(放在〈table>下）在表格上方加标题8。

web前端笔记整理一---HTML

web前端笔记整理⼀---HTML ⼀ HTML标签1 页⾯及标记1 HTML ⽂件结构拓展名 .html或者.htm<!DOCTYPE html>// 声明<html> html 主体<head></head> 头信息：浏览器，搜索引擎使⽤ title<body> // ⽤户看的hello wroldhello wrold</body></html>2 语⾔字符集(Charsets)的信息<meta http-equiv="Content-Type" content="text/html;charset=#">常⽤utf-8,gb2312 最好⾃⼰在浏览器的选项菜单内选择相应的语⾔3 背景⾊彩和⽂字⾊彩背景图象 <body background="image-URL">4 图⽚路径<img src="static/images/1.jpg"alt="这个是alt" />5 链接<a>跳转到页⾯的另外⼀个地⽅<a href="#name"> ... </a><a name="name"> ... </a><a href="samp/window.html" target="_blank">开⼀个新窗⼝!</a>6 标尺线标尺线<hr size=10>⼆⽂字及⽂字布局1 6级标题<h1>…<h1/>到 <h6>…<h6/>2 ⽂字变化<b>加粗</b><em>斜体</em><i>斜体</i><small>变⼩</small><strong>加强加粗</strong><sub>上标</sub><sup>下标</sup>3 布局标签<table><tr><td></td></tr></table>Form表单：method：post get put delete⽂件上传：Method postMultity-post-data单选框：radio复选框：checkbox输⼊：input传递⽅式：Get: url 地址传值 256字符Post: 后台：推荐这个placeholder="请输⼊⽤户名"<form action="url" method=*>......<input type=submit> <input type=reset></form>5 移动⽂字<marquee>啦啦啦，我会移动耶！</marquee>。

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前端技术知识点之多之杂，要想在考试中取得好成绩，需要对各种知识点进行深入理解和掌握。

web前端知识点总结记忆

web前端知识点总结记忆在当今互联网时代，Web前端开发已经成为了一门非常热门的技术，前端开发人员的需求也越来越大。

在这个过程中，掌握一些基础的Web前端技术和知识是非常重要的。

本文将总结一些常见的Web前端知识点，希望能够帮助读者更好地理解Web前端开发技术。

HTML（HyperText Markup Language）HTML是Web前端开发的基础，它是用来描述网页结构的一种标记语言。

HTML由一系列的元素（elements）组成，每个元素都由起始标签（start tag）和结束标签（end tag）组成。

标签中还可以包含一些属性（attributes），用来指定元素的一些特性。

常见的HTML元素包括标题（<h1>~<h6>）、段落（<p>）、列表（<ul>、<ol>、<li>）、链接（<a>）、图片（<img>）、表格（<table>、<tr>、<td>）等等。

在HTML5中，还新增了一些新的语义化元素，例如<section>、<article>、<header>、<footer>等等。

CSS（Cascading Style Sheets）CSS被用来描述网页的样式和布局。

它可以控制网页中元素的颜色、大小、位置等各种外观特性。

使用CSS可以将网页内容和其外观样式分离，提高了代码的可维护性。

CSS规则（rule）由选择器（selector）和声明块（declaration block）组成。

选择器用来选择需要应用样式的元素，声明块中包含了一系列的样式声明，每个声明由属性名（property）和属性值（value）组成。

除了普通的样式声明外，CSS3还引入了一些新的功能，例如渐变（gradient）、阴影（box-shadow）、动画（animation）等。

web前端开发课后习题汇总

D.<p>A <b><i>short</b> paragraph
14.在以下的HTML中，哪个是正确引用外部样式表的方法？（B）
A.<style src="mystyle.css">
B.<link rel="stylesheet" type="text/css" href="mystyle.css">
C..menu .home {color:#fff;}
D.div.menu li a {color:#fff;}
9.在css选择器当中，优先级排序正确的是（B）
A.id选择器>标签选择器>类选择器
B.id选择器>类选择器>标签选择器
C.类选择器>标签选择器>id选择器
D.标签选择器>类选择器>id选择器
<button id="show" type="button">显示</button>
</body>
</html>
4.
<!DOCTYPE html>
<html>
<head>
<script _____src____="/jquery/jquery-1.11.1.min.js">
</script>
<script>
50)</form>
51)</body>
52)</html>
3.

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

8.<web>
检查IIS服务器是否配置成功的4种方法
1.http://localhost
2.http://XXX（xxx为服务器名称，如WG-PC）
3.分配的ip地址
4.本地固定ip地址127.0.0.1
9.<html>
.GIF格式
特点：它的图片数据量小，可以带有动画信息，且可以透明背景显示，但最高只支持256种颜色。

用途：大量用于网站的图标Logo、广告条Banner及网页背景图像。

但由于受到颜色的显示，不适合用于照片级的网页图像。

.JPEG格式
特点：可以高效地压缩图片的数据量。

使图片文件变小的同时基本不丢失颜色画质。

用途：通常用于显示照片等颜色丰富的精美图像。

.PNG格式
特点：是一种逐步流行的网络图像格式。

既融合了GIF能做成透明背景的特点，又具有JPEG 处理精美图像的优点。

用途：常用于制作网页效果图。

10.<html>
<!doctype>声明不属于HTML标记，它是一条指令，告诉浏览器编写页面所用的标记的版本。