Web前端
Web前端学习笔记
Jhinhua
这个作者很懒,什么都没留下…
展开
-
HTML——ajax在flask框架中的应用(2)
register.html <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>注册</title> <style> .exist_name{ color: red; /* 一开始的时候是隐藏的 */...原创 2020-03-19 22:57:21 · 118 阅读 · 0 评论 -
HTML——ajax在flask框架中的应用(1)
ajax_jQ.html <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script src="https://apps.bdimg.com/libs/jquery...原创 2020-03-19 22:56:03 · 260 阅读 · 0 评论 -
HTML——ajax注册检测案例
ajax,注册用户名时用户名存在与否 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> .exist_name{ color: red; /* 一开始的时候是隐藏的 */...原创 2020-03-19 22:49:14 · 106 阅读 · 0 评论 -
HTML——Vue—案例
案例(采购) <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="../js/vue.min.js" type="text/javascript" charset="utf-8"><...原创 2020-03-19 16:03:11 · 256 阅读 · 0 评论 -
HTML——Vue—生命周期钩子
生命周期钩子 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="../js/vue.min.js" type="text/javascript" charset="utf-8"><...原创 2020-03-19 15:58:50 · 180 阅读 · 0 评论 -
HTML——Vue—基本语法
Vue基本语法 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="../js/vue.min.js" type="text/javascript" charset="utf-8">...原创 2020-03-19 15:49:32 · 218 阅读 · 0 评论 -
HTML——响应式布局+Vue简介
响应式布局 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <meta name="viewport" content="width=device-width, initial-scale=1, maximu...原创 2020-03-19 14:48:53 · 262 阅读 · 0 评论 -
HTML——bootstrap
bootstrap的简单使用 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link href="../bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="s...原创 2020-03-19 14:10:48 · 202 阅读 · 0 评论 -
HTML——jQuery—"放大镜"
放大镜 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0; padding: 0; } #container{ ...原创 2020-03-19 14:07:24 · 90 阅读 · 0 评论 -
HTML——jQuery—轮播图
轮播图案例 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0; padding: 0; font-size: 0; } ...原创 2020-03-19 14:04:45 · 102 阅读 · 0 评论 -
HTML——jQuery—动画案例
动画案例 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> div{ width: 300px; height: 300px; background-colo...原创 2020-03-19 14:03:22 · 101 阅读 · 0 评论 -
HTML——jQuery—上滑与下拉案例
案例 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0; padding: 0; } .box{ width: 300p...原创 2020-03-18 22:32:27 · 252 阅读 · 0 评论 -
HTML——jQuery—动画特效之淡入淡出案例
案例 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0; padding: 0; } .box{ width: 300p...原创 2020-03-18 22:31:21 · 401 阅读 · 0 评论 -
HTML——jQuery—动画特效之隐藏和显示案例
案例 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0; padding: 0; } .box{ width: 300px;...原创 2020-03-18 22:30:21 · 303 阅读 · 0 评论 -
HTML——jQuery—事件
事件 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0; padding: 0; } div{ width: 200px...原创 2020-03-18 22:27:25 · 97 阅读 · 0 评论 -
HTML——jQuery—遍历
遍历 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="../js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8...原创 2020-03-18 22:25:51 · 142 阅读 · 0 评论 -
HTML——jQuery—盒子模型
盒子模型 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0; padding: 0; } div{ width: 300...原创 2020-03-18 20:06:18 · 156 阅读 · 0 评论 -
HTML——jQuery—html-css方法
html-css方法 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="../js/jquery-3.4.1.min.js" type="text/javascript" charse...原创 2020-03-18 20:01:37 · 104 阅读 · 0 评论 -
HTML——jQuery—css样式+html&css方法
目录css样式 html&css方法 css样式 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="../js/jquery-3.4.1.min.js" >&...原创 2020-03-18 19:59:44 · 121 阅读 · 0 评论 -
HTML——jQuery—文本+属性
目录操作文本 操作属性 操作文本 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="../js/jquery-3.4.1.min.js"></script>...原创 2020-03-18 19:57:11 · 125 阅读 · 0 评论 -
HTML——jQuery—引入+选择器
目录jQuery引入 jQuery选择器 jQuery引入 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <!-- 如果想用JQ的内容就得先将其引入 --> <!-- 1.本地有...原创 2020-03-18 19:55:24 · 217 阅读 · 0 评论 -
HTML——JS—捕获传递
捕获传递 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> .outer{ width: 300px; height: 300px; background-c...原创 2020-03-18 14:27:46 · 114 阅读 · 0 评论 -
HTML——JS—事件的监听
事件监听 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!-- 事件的监听 --- 可以理解为为标签绑定事件的另外一种方式 --- ...原创 2020-03-18 14:23:43 · 648 阅读 · 0 评论 -
HTML——JS—事件的传递机制
传递机制 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> .outer{ width: 300px; height: 300px; background-c...原创 2020-03-18 14:22:52 · 660 阅读 · 0 评论 -
HTML——JS—滚动事件
案例 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> body{ height: 2000px; background: linear-gradient(red, ...原创 2020-03-18 14:21:37 · 916 阅读 · 0 评论 -
HTML——JS—表单的change事件
案例 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body onload="init()"> <!-- 省市联动 --> &l...原创 2020-03-18 13:06:50 · 1259 阅读 · 0 评论 -
HTML——JS—根据条件提交或阻止提交表单
表单提交 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!-- 在表单中数据之所以能提交成功 是因为表单的 onsubmit事件的 结果 默...原创 2020-03-18 13:05:30 · 984 阅读 · 0 评论 -
HTML——JS—选择页码(案例)
页码的选择 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> #box{ /* background-color: palegoldenrod; */ } .pr...原创 2020-03-18 13:00:50 · 1739 阅读 · 0 评论 -
HTML——JS—表单事件+表单提交
目录表单事件 表单提交 表单事件 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> //表单事件中 // onfocus 获取...原创 2020-03-18 12:59:29 · 1882 阅读 · 0 评论 -
HTML——JS—键盘事件
目录键盘事件 案例 键盘事件 键盘事件中 altKey ctrlKey shitfKey metaKey key --- 获取的点击的键盘上的什么符号 charcode --- onkeypress事件中 获取的字符对应的ASCII码 案例 <!DOCTYPE...原创 2020-03-18 12:57:10 · 327 阅读 · 0 评论 -
HTML——JS—鼠标事件
鼠标事件 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> img{ /* 绝对定位 */ position: absolute; /* 初始定位值 */ ...原创 2020-03-18 12:53:51 · 104 阅读 · 0 评论 -
HTML——JS—事件绑定+事件对象
目录事件绑定 事件对象 事件绑定 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <!-- <button onclick="ale...原创 2020-03-17 22:38:45 · 457 阅读 · 0 评论 -
HTML——JS—元素节点的属性
常用属性 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style> *{ margin: 0; padding: 0; } .outer{ width: ...原创 2020-03-17 22:35:31 · 58 阅读 · 0 评论 -
HTML——JS—节点的增删改操作
增删改 DOM 节点的操作 添加 插入 替换 移除这些操作 都是有父节点完成的 1. 创建节点和添加节点 2. 指定节点之前插入节点 3. 替换节点 4. 移除节点 演示 <!DOCTYPE html><html> <head> <meta charset="utf-8"> ...原创 2020-03-17 22:34:04 · 318 阅读 · 1 评论 -
HTML——JS—样式
样式操作 操作样式的 设置样式 元素节点.style.样式名 = “样式值” 获取的时候 元素节点.style.样式名 只能获取行内样式 获取所有的设置得的样式 tag_node是元素节点 style_name是样式名称 function getStyle(tag_node,style_name){ if(...原创 2020-03-17 22:30:43 · 134 阅读 · 0 评论 -
HTML——JS—文本+属性
目录文本 样式 文本 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <p class="page">岱宗夫如何?齐鲁青未了。造化钟...原创 2020-03-17 22:28:19 · 125 阅读 · 0 评论 -
HTML——JS—location(网址信息对象)
location(网址信息对象) <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <form action="" method="get"> ...原创 2020-03-17 15:44:14 · 347 阅读 · 0 评论 -
HTML——JS—延时器+编码
目录延时器 编码 延时器 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <button class="btn">取消延时对应的操作...原创 2020-03-17 15:41:38 · 296 阅读 · 0 评论 -
HTML——JS—定时器
目录定时器 定时器关闭广告案例 定时器 <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script> /** * ...原创 2020-03-17 15:38:56 · 583 阅读 · 0 评论 -
HTML——JS—文档对象document
目录文档对象document 获取元素节点 文档对象document DOM --- Document Object Model 文档对象模型 在文档对象模型中 它是以节点的形式来操作文档的 常用的节点的分类: 元素节点 --- 标签 属性节点 --- 标签的属性 文本节点 --- 文本节点 文本是嵌套在标签之间的 ...原创 2020-03-17 14:45:03 · 212 阅读 · 0 评论