WEB
关注
分享
扫一扫
文章平均质量分 78
WEB笔记
f_carey
信息安全的螺丝钉，欢迎同好们一起交流，分享，博客接受转发，与大家一同进步！
展开
-
Python Django WEB框架
Django WEB框架1 基本WEB框架2 WSGI2.1 HTML文档模板2.2 WSGI-基本配置2.3 WSGI 动态WEB实现：结合Jinja23 Django3.1 Django框架3.2 Django基本使用3.2.1 命令行模式下创建 Django 项目3.2.2 使用 Pycharm 创建 Django 项目3.3 Django 配置文件修订4 配置一个项目4.1 urls.py4.2 views.py4.3 login.html1 基本WEB框架import socketser原创 2021-03-05 08:09:17 · 364 阅读 · 1 评论 -
WEB基础之： jQuery 核心
jQuery 核心1. jQuery 核心函数2. jQuery 对象访问3. 数据缓存4. 插件jQuery 杂项1. 数组和对象操作所有案例示例<body> <ul> <li id="i1">l1</li> <li id="i2">l2</li> <li id="i3">l3</li> </ul> <script s原创 2021-03-04 23:45:28 · 187 阅读 · 1 评论 -
WEB基础之： jQuery 效果
jQuery 效果1. 滑动2. 淡入淡出3. 自定义4. 设置show([speed,[easing],[fn]]): 显示隐藏的匹配元素。$('p').show('show')1. 滑动slideDown([speed],[easing],[fn]): 通过高度变化（向下增大）来动态地显示所有匹配的元素，在显示完成后可选地触发一个回调函数。$("p").slideDown('slow', function(){ alert("Animation Done.");原创 2021-03-04 23:44:43 · 174 阅读 · 1 评论 -
WEB基础之：jQuery 事件
jQuery 事件1. 页面载入1.1 jQuery 入口函数1.2 JavaScript 入口函数:1.3 jQuery 入口函数与 JavaScript 入口函数的区别：2. 事件处理3. 事件切换4. 事件5. 阻止后续事件执行6. 事件委托示例<!DOCTYPE html><html lang="en"><head> <title>事件不生效</title> <script src="jquery-3.5.1.原创 2021-02-28 17:02:00 · 146 阅读 · 1 评论 -
WEB基础之：jQuery操作
jQuery操作1. 属性操作2. 类操作3. HTML/文本/值4. CSS操作4.1 位置4.2 尺寸5. 文档操作5.1 内部插入5.2 外部插入5.3 包裹5.4 替换5.5 删除5.6 复制1. 属性操作示例<body> <input type="checkbox" name="checkbox" value="checkbox1" checked="checked"> <img src="images/paperplane.png" alt="原创 2021-02-28 17:01:08 · 366 阅读 · 0 评论 -
WEB基础之：jQuery 筛选方法
jQuery 筛选方法1. 过滤2. 查找2.1 前项查找2.2 后项查找2.3 父项查找2.4 子项查找2.5 其他查找示例<body> <ul> <li class="c1">list item 1</li> <li class="c2" id="i1">list item 2</li> <li class="c1 c2" id="i2">list item 3原创 2021-02-27 10:56:21 · 288 阅读 · 0 评论 -
WEB基础之： jQuery选择器
jQuery选择器1. ID选择器2. 元素选择器3. 类选择器4. 组合选择器5. 层级选择器6. 基本选择器7. 内容选择器8. 可见性选择器9. 属性选择器10. 表单选择器10. 1 表单对象属性筛选器11. 混淆选择器示例：<body> <a href="http://jquery.com/" id="linkID" class="linkClass">jQuery</a> <script src="jquery-3.5.1.js"&g原创 2021-02-27 10:55:19 · 173 阅读 · 0 评论 -
WEB基础之：JavaScript转义
JavaScript转义1. encodeURI()1.1 注意2. decodeURI()3. encodeURIComponent()3.1 `encodeURIComponent()` 和 `encodeURI` 比较3.2 注意4. decodeURIComponent()5. URIError5.1 示例1. encodeURI()encodeURI() 函数通过将特定字符替换为转义序列来对统一资源标识符 (URI) 进行编码 。encodeURI 会替换所有的字符，但不包括以下字符，即使它原创 2021-02-26 07:07:26 · 1930 阅读 · 0 评论 -
WEB基础之：JavaScript面向对象
javascript面向对象1. 对象与属性1.1 枚举一个对象的所有属性2. 创建新对象2.1 对象初始化器创建对象2.2 使用构造函数创建对象2.3 使用 Object.create 方法创建对象2.4 继承2.5 定义方法2.6 通过 `this` 引用对象1. 对象与属性一个 javascript 对象有很多属性。一个对象的属性可以被解释成一个附加到对象上的变量。对象的属性和普通的 javascript 变量基本没什么区别，仅仅是属性属于某个对象。属性定义了对象的特征，可以通过"."符号来访原创 2021-02-26 07:01:58 · 308 阅读 · 0 评论 -
WEB基础之：JavaScript Date时间处理
JavaScript Date时间处理1. 语法1.1 参数2. 方法2.1 Getter方法2.2 实例2.3 计算经过时间1. 语法new Date();new Date(value);new Date(dateString);new Date(year, monthIndex [, day [, hours [, minutes [, seconds [, milliseconds]]]]]);1.1 参数空：如果没有提供参数，那么新创建的Date对象表示实例化时刻的日期和时间。原创 2021-02-26 07:00:54 · 529 阅读 · 0 评论 -
WEB基础之：JavaScript对象序列化
JavaScript对象序列化1. 序列化2. 反序列化2.1 使用reviver函数2.2 `JSON.parse()` 不允许用逗号作为结尾1. 序列化JSON.stringify(value[, replacer [, space]]) 方法将一个 JavaScript 对象或值转换为 JSON 字符串。可选replacer，如果是一个函数，则在序列化过程中，被序列化的值的每个属性都会经过该函数的转换和处理；如果是一个数组，则只有包含在这个数组中的属性名才会被序列化到最终的 JSON 字原创 2021-02-25 15:41:50 · 1332 阅读 · 0 评论 -
WEB基础之：JavaScript HTML DOM
JavaScript HTML DOMJavaScript HTML DOM1. Document2. Document 对象3. Document方法3.1 查找HTML 元素3.1.1 转义特殊字符3.2 改变 HTML 输出流3.3 改变 HTML 内容3.4 改变 HTML 属性3.5 改变 HTML 样式3.6 使用事件3.6.1 添加事件并对事件做出反应3.6.2 打开一个输出流,添加一些文本，然后关闭输出流3.6.3 使用 HTML DOM 来分配事件3.6.4 onload 和 on原创 2021-02-25 15:40:33 · 442 阅读 · 0 评论 -
WEB基础之：客户端网页 API
客户端网页 API1. web浏览器的重要部分2. 文档对象模型3. 基本的DOM 操作3.1 创建并放置新的节点3.2 移动和删除元素3.3 操作样式4. Window对象4.1 Window 对象属性4.2 window对象方法1. web浏览器的重要部分[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-xFZyK5yI-1610672830621)(https://mdn.mozillademos.org/files/14557/document-window-navi原创 2021-01-15 09:07:36 · 309 阅读 · 0 评论 -
WEB基础之：JavaScript错误处理
JavaScript错误处理1. try 和 catch2. finally 语句3. Throw 语句1. try 和 catchJavaScript 语句 try 和 catch 是成对出现的。try 语句允许我们定义在执行时进行错误测试的代码块。catch 语句允许我们定义当 try 代码块发生错误时，所执行的代码块。try { ... //异常的抛出} catch(err) { ... //异常的捕获与处理} finally { ...原创 2021-01-15 09:06:47 · 140 阅读 · 0 评论 -
WEB基础之：JavaScript函数
JavaScript函数1. 浏览器内置函数2. 自定义函数3. 调用函数3.1 函数作用域4. 匿名函数5. 返回值6.立即执行函数Immediately-Invoked Function Expression (IIFE)6.1 函数的声明与执行过程6.2 问题的核心6.3 立即执行函数表达式6.4 用闭包保存状态6.5 自执行匿名函数和立即执行的函数表达式区别.7. eval()1. 浏览器内置函数console.log(value);myArray.join();myString.repla原创 2021-01-10 08:45:24 · 452 阅读 · 0 评论 -
WEB基础之：JavaScript循环语句
JavaScript循环语句1. for 循环2. 使用break退出循环3. 使用continue跳过迭代4. while语句和do ... while语句1. for 循环for (initializer; exit-condition; final-expression) { // code to run}2. 使用break退出循环使用break语句在所有迭代完成之前退出循环;当switch语句中符合输入表达式的情况满足时，break语句立即退出switch语句并移动到代码之后。原创 2021-01-10 08:40:24 · 753 阅读 · 0 评论 -
WEB基础之：JavaScript条件语句
JavaScript条件语句1. if ... else 语句1.1 基本的的 if…else 语法1.2 // 嵌套if ... else2. switch语句3. 三元运算符1. if … else 语句1.1 基本的的 if…else 语法//写法一：if (condition) { code to run if condition is true} else { run some other code instead}//写法二：if (condition) { cod原创 2021-01-06 23:33:16 · 233 阅读 · 0 评论 -
WEB基础之：JavaScript中的数据类型操作
JavaScript中的数据类型操作1. 字符串1.1 字符串方法2. 数组2.1 访问和修改数组元素2.2 数组方法2.2.1 字符串和数组之间的转换2.2.2 添加和删除数组项1. 字符串**单引号和双引号：**在JavaScript中，您可以选择单引号或双引号来包裹字符串。**转义字符串中的字符：**如转义'号，let bigmouth = 'I\'m fine';上下文中的串联<button>Press me</button>const butt原创 2021-01-06 23:31:50 · 195 阅读 · 1 评论 -
WEB基础之：JavaScript算术运算符
JavaScript算术运算符1. 运算符优先级2. 自增和自减运算符3. 赋值运算符4. 比较运算符1. 运算符优先级运算符的优先级，用于确定一个表达式的计算顺序。在你不能确定优先级时，可以通过使用括号显式声明运算符的优先级。下表列出了描述符的优先级，从最高到最低。Operator typeIndividual operatorsmember. []call / create instance() newnegation/increment! ~ - + ++原创 2021-01-04 10:10:32 · 305 阅读 · 0 评论 -
WEB基础之：JavaScript基础
1. JavaScript简介JavaScript 被设计用来向 HTML 页面添加交互行为。JavaScript 是一种脚本语言（脚本语言是一种轻量级的编程语言）。JavaScript 是一种解释性语言（代码执行不进行预编译）。JavaScript的组成ECMAScript：JavaScript标准化部分，主要定义了基础的数据类型，语法，关键字等等。DOM(文档对象模型)：Document object model ，整合JS，CSS，HTML。BOM(浏览器对象模型)： Broswe原创 2021-01-04 10:09:10 · 427 阅读 · 0 评论 -
WEB基础之：CSS 用户界面样式
用户界面样式1. 光标2. 轮廓 outline2.1 设置轮廓样式2.2 轮廓宽度2.3 设置轮廓颜色2.4 汇总1. 光标cursor:default类型属性值描述Generalauto浏览器根据当前内容决定指针样式，例如当是内容是文字时使用text样式Generaldefault默认指针，通常是箭头。Generalnone无指针被渲染链接及状态context-menu指针下有可用内容目录。链接及状态help指示帮助链接及状原创 2020-12-30 11:45:40 · 408 阅读 · 0 评论 -
WEB基础之：CSS列表与生成内容
列表与生成内容1. 列表1.1 列表类型1.1.1 字符串标记1.1.2 图像标记1.2 列表标志位置1.3 简写列表样式2. 生成内容2.1 插入生成内容2.2 指定内容2.3 插入属性值2.4 生成引号3. 计数器3.1 重置和递增1. 列表1.1 列表类型list-style-type 广泛支持的类型：disc默认, circle, square, disclosure-open, disclosure-closed, decimal, decimal-leading-zero, arabic原创 2020-12-27 09:57:41 · 371 阅读 · 0 评论 -
WEB基础之：CSS表格布局 Table Layout
表格布局 Table Layout1. 表格式化1.1 表编排规则1.2. 表显示值1.2.1 列1.3 匿名表对象1.3.1 对象插入规则1.4 表层1.5 表标题2. 表单元格边框2.1 合并或分隔单元格边框2.2 边框间隔2.3 处理空单元格2.4 合并单元格边框2.4.1 合并单元格边框规则3. 表大小3.1 宽度3.2 高度3.3 对齐3.3.1 行内元素的值3.3.2 表格单元格的值1. 表格式化1.1 表编排规则每个行框包含一行表格单元。表中的所有行框按其在源文档中出现的顺序从上到下地原创 2020-12-25 09:54:22 · 2173 阅读 · 0 评论 -
WEB基础之：CSS定位position
定位position1.1 **定位上下文**1.2 z-index1.3 宽度和高度2. 内容溢出和剪裁2.1 溢出overflow2.2 剪裁clip3. 元素可见性visibility4. 绝对定位4.1 包含块和绝对定位4.2 绝对定位元素的放置和大小4.3 非替换元素的放置和大小4.4 替换元素的放置和大小position 属性规定元素的定位类型。 top, bottom, left, 和 right 来精确指定要将定位元素移动到的位置(如top: 30px;)属性值描述原创 2020-12-25 09:50:06 · 567 阅读 · 0 评论 -
WEB基础之：CSS浮动和嵌入形状
浮动和嵌入形状 Floating and Shapes1. 浮动Floating1.1 控制浮动元素摆放的规则1.2 应用行为Applied Behavior1.3 清除Clearing2. 嵌入形状Shapes2.1 shape-outside属性2.1.1 shape-box的类型2.1.2 basic-shape的类型2.1.3 语法2.2 shape-margin1. 浮动Floatingfloat属性允许浮动任何元素，如：图像、段落、列表。属性值描述left元素向左原创 2020-12-21 07:03:33 · 592 阅读 · 0 评论 -
WEB基础之：CSS Margins,Padding 和 Borders, Outlines
Margins,Padding 和 Borders, Outlines1. 宽度和高度2. margin与padding3. 边框3.1 **边框的样式：**3.2 **边框宽度与颜色：**3.3 全局Global Borders3.3.1 圆角边框Rounding Border Corners3.4 外边框outline-style3.4.1 外边框样式：3.4.2 **outline-width**1. 宽度和高度这两个属性不能应用到行内非替换元素。如果声明一个超链接，其高度和宽度由链接的内容确定，原创 2020-12-21 07:02:20 · 526 阅读 · 0 评论 -
WEB基础之：CSS基本视觉格式化
基本视觉格式化1. 基本框Basic Boxes2. 元素显示选择Altering Element Display2.1 将行内样式显示为块级样式2.2 将列表元素显示为行内样式3. 块级元素3.1 水平格式化3.1.1 水平属性Horizontal Properties3.1.2 Using auto3.1.3 负外边距Negative Margins3.1.4 百分数percentage3.1.5 替换元素Replaced Elements3.2 垂直格式化Vertical Formatting3.2原创 2020-12-17 16:49:08 · 624 阅读 · 0 评论 -
WEB基础之：CSS文本属性
文本属性1. 缩进和水平对齐1.1 缩进文本2. 水平对齐2.1 justify2.2 text-align:center 与 ``3. 垂直对齐3.1 行高3.2 构造文本行3.3 指定line-height 值4. 垂直对齐文本4.1 基线对齐4.2 上标与下标4.3 底端对齐与顶 端对齐4.4 居中对齐4.5 百分数4.6 垂直对齐中的长度对齐5. 字间隔和字母间隔5.1 字间隔word-spacing5.2 字母间隔letter-spacing5.3 间隔和对齐6. 文本转换Text Trans原创 2020-12-17 16:47:38 · 589 阅读 · 0 评论 -
WEB基础之：CSS字体
字体1. 字体系列2. font-family使用字体系列3. font-weight字体加粗4. 字体大小结合使用百分比和 EM5. 字体风格和变形5.1 font-style属性5.2 font-variant属性6. 拉伸和调整字体6.1 font-stretch拉伸字体6.2. font-size-adjust 调整字体7. font属性7.1 典型字体规则7.2 line-height增加行高1. 字体系列除了各种特定的字体系列外，CSS 定义了 5 种通用字体系列：Serif 字体:原创 2020-12-13 21:06:11 · 540 阅读 · 0 评论 -
WEB基础之：CSS值和单位
值和单位1. 数字2. 百分数3. 颜色3.1 命名颜色3.2 函数式RGB颜色3.3 十六进制RGB颜色3.4 Web安全颜色4. 长度单位4.1 绝对长度单位4.2 相对长度单位4.2.1 em4.2.2 ex4.2.3 像素长度5. URL6. 关键字7. CSS2中的单位1. 数字CSS中有两类数字：整数和实数。实数定义为整数后可跟有小数点和小数部分。2. 百分数百分数是一个可计算得出的实数，其后跟一个百分号(%)。**百分数值几乎总是相对于另一个值，**这个值是任意的：可能是同一个元素另原创 2020-12-13 21:05:01 · 182 阅读 · 0 评论 -
WEB基础之：CSS结构和层叠
CSS结构和层叠1. 特殊性2. 重要性3. 继承4. 层叠4.1 层叠的规则4.2 按权重和来源排序4.3 按特殊性排序4.4 按顺序排序4.5 非CSS表现提示1. 特殊性在CSS中针对某个元素的多个相同的规则，浏览器会计算其特殊性。如果一个元素有多个冲突的规则，具有最高特殊性的声明会胜出。特殊性值表述为4个部分，如：0,0,0,0，具体规则如下对于内联声明(style)的特殊性为1,0,0,0;对于选择器中给定的各个ID属性值，加0,1,0,0;对于选择器中给定的各个类属性值,属性选择或原创 2020-12-11 10:35:58 · 218 阅读 · 0 评论 -
WEB基础之：CSS选择器
CSS选择器1. 规则结构2. 元素选择器3. 选择器分组3.1 多选择器分组3.2 通配选择器3.3 声明分组3.4 结合选择器和声明的分组4. 类选择器4.1 类选择器4.2 多类选择器5. ID选择器5.1 ID 选择器5.2 类选择器还是 ID 选择器？5.3 区分大小写6. 属性选择器6.1 简单属性选择6.2 根据具体属性值选择6.3 根据部分属性值选择6.4 特定属性选择类型7. 后代选择器7.1 根据上下文选择元素7.2 语法解释8. 子元素选择器9. 选择相邻兄弟元素10. 伪类选择器1原创 2020-12-11 10:34:39 · 787 阅读 · 0 评论 -
WEB基础之：CSS结合HTML
CSS结合HTML1. link标记1.1 属性2. 候选样式表2.1 候选样式表2.2 根据显示媒体为网站选择相应的表现3. style元素3.1 style元素包含样式表3.2 @import指令3.3 具体样式规则4. 内联样式5. 向后可访问性6. CSS注释1. link标记<link rel="stylesheet" type="text/css" href="css_1.css" media="all">1.1 属性rel: 关系(relation)为stylesheet原创 2020-12-06 12:25:17 · 278 阅读 · 0 评论 -
WEB基础之： form标签
form表单1. form标签属性1.1 action 属性1.2 name属性1.3 method传送方法1.4 enctype编码方式1.5 target目标显示方式2. form中input输入类的控件2.1 text文字字段2.2 password密码域2.3 radio单选按钮2.4 checkbox复选框2.5 button普通按钮2.6 submit提交按钮2.7 reset重置按钮2.8 image图像域2.9 hidden隐藏域2.10 file文件域3. form中lable定义标签4原创 2020-12-03 06:41:37 · 4071 阅读 · 0 评论 -
WEB基础之：层标签div
层div1. div(division)标签1.1 align1.2 id1.3 class1.4 style1.4.1 position属性1.4.2 display属性1.4.3 display属性与visibility属性的对比2. span标签与div标签3. iframe标签 层属于网页中的块级元素，层元素中可以包含所有其他的HTML代码。层提供了一种分块控制网页内容的方法。各层之间可以彼此叠加，各层次序可以改变。1. div(division)标签 < div> 是一个原创 2020-11-25 08:08:03 · 4785 阅读 · 0 评论 -
WEB基础之：创建表格
创建表格1. 表格的基本结构2. 表格基本属性3. 表格的行属性4. 单元格属性5. 表格的结构1. 表格的基本结构1) 表格的基本结构 <table> <tr> <td>表格第一行第一个单元格</td> <td>表格第一行第二个单元格</td> </tr> <tr> <td&原创 2020-11-23 11:40:28 · 3178 阅读 · 0 评论 -
WEB基础之：图像标记
图像标记1) src插入一张图像 <img src="images/1.jpg">2) height，width图像高度与宽度 <img src="images/1.jpg" height="160"> <img src="images/1.jpg" width="160"><!-- 在该语法中，图像的单位是像素，如果只设置了高度或宽度，则另一个参数会等比例变化；如果同时设置两个属性，且缩放比例不同的情况下，图像可能会变形；-->原创 2020-11-20 06:06:41 · 1301 阅读 · 0 评论 -
WEB基础之：超链接
超链接1. href超链接标记2. target超链接打开窗口方式3. name书签链接(锚)4. 外部链接<a> 标签定义超链接，用于从一张页面链接到另一张页面。<a> 元素最重要的属性是 href 属性，它指示链接的目标。在所有浏览器中，链接的默认外观是： 未被访问的链接带有下划线而且是蓝色的 已被访问的链接带有下划线而且是紫色的 活动链接带有下划线而且是红色的< a>属性属性值描述charsetcha原创 2020-11-16 14:06:12 · 892 阅读 · 0 评论 -
WEB基础之：列表的标记
列表的标记1. ul无序列表1.1 无序列表的序号类型1.2 无序列表嵌套2. ol有序列表2.1 type有序列表的序号类型2.2 start有序列表的起始数值2.3 有序列表嵌套3. dl定义列表4.列表文字的颜色标签描述标签描述< ul>无序列表。< menu>，< dir>< dl>定义列表。< ol>有序列表。< dt>定义项目。< li>列表项。< dd原创 2020-11-12 15:25:30 · 1374 阅读 · 0 评论 -
WEB基础之：HTML文档的基本结构
HTML文档的基本结构1. HTML文档的基本结构2. HTML头部标记2.1 < title> 标题标记2.2 < meta>元信息标记2.3 < base>基底网址标记2.4 < body>页面的主体标记2.5 文本内容标记2.5.1 标题格式2.5.2 文本字体格式注：特殊符号代码2.5.3 段落格式2.5.4 水平线格式2.5.5 其他标记1. HTML文档的基本结构1) <!DOCTYPE html>: 文档类型声明（Documen原创 2020-11-12 15:24:13 · 1670 阅读 · 0 评论