qq_45095748的博客

原创 【云笔记10】笔记管理2

笔记管理一、当根据笔记本创建了笔记，用户可以通过选择笔记本来加载笔记本下的所有笔记，并可以选中笔记进行修改保存笔记内容。加载笔记列表流程：选择笔记本 -> 发送加载笔记列表 -> 过滤拦截请求 -> 分配控制器 -> 执行controller.execute()方法 -> 返回数据 -> 动态生成笔记列表保存笔记流程：选择笔记 -> 编辑笔记内容 点击保存发送请求-> 过滤拦截请求 -> 分配控制器 -> 执行 controller.execu

原创 【云笔记9】Layui前端框架

Layui前端框架layui（谐音：类UI) 是一款采用自身模块规范编写的前端 UI 框架，遵循原生 HTML/CSS/JS 的书写与组织形式，门槛极低，拿来即用。其外在极简，却又不失饱满的内在，体积轻盈，组件丰盈，从核心代码到 API 的每一处细节都经过精心雕琢，非常适合界面的快速开发。layui 首个版本发布于 2016 年金秋，她区别于那些基于 MVVM 底层的 UI 框架，却并非逆道而行，而是信奉返璞归真之道。准确地说，她更多是为服务端程序员量身定做，你无需涉足各种前端工具的复杂配置，只需面对浏

原创 【云笔记8】笔记管理

笔记管理笔记管理的前端显示<!-- 如果笔记名称不为空,那么按照名称查询。如果笔记名称为空，笔记内容不为空按照笔记内容查询。 如果笔记名称和内容都为空，那么查询某一个固定的 --> <div class="layui-form-item"> <div class="layui-inline"> <input type="text" name="name" id="name" autocompl

原创 【云笔记7】Mybaits的入门案例

Mybaits的入门案例1、读取配置文件2、创建SqlSessionFactory工厂3、创建Session4、创建dao接口的代理对象5、执行dao中的方法6、释放资源注意事项​ 不要忘记在映射配置中告知mybatis要封装到哪个实体类中​ 配置方式：指定实体类的全限定性类名...

原创 【云笔记6】MyBatis 动态SQL

if标签和bind标签set标签 <select id="getNote" resultType="com.noteserves.result.NoteResult"> select notes.id,notes.content,notes.name,notes.addtime,notes.isdelete,notebooks.name as "notebooksname" from note_t_notes notes,note_t_notebooks notebooks

原创 【云笔记5】笔记本添加

笔记本添加1.修改数据显示的高度2.添加（添加按钮）addnotebook【绑定事件】3.点击添加按钮弹出层（使用layui弹出层）4.修改弹出层样式5.建立notebook_add.html6.Ajax的使用7.添加的笔记本名称不能为空8.点击添加笔记本确定后，直接刷新页面在界面中显示 <button id="addnote" type="button" class="layui-btn">添加</button>layui.use(['layer','jq

原创 【云笔记4】文件的上传

文件的上传配置pom.xml <!-- 文件上传 --> <!-- https://mvnrepository.com/artifact/commons-fileupload/commons-fileupload --> <dependency> <groupId>commons-fileupload</groupId>

原创 【云笔记3】注册模块后台

注册模块页面显示前端页面使用layui框架

原创 【云笔记2】登录后台模块

登录页面样式显示前端使用layui框架后台模块entity层public class User implements Serializable{ /** * */private static final long serialVersionUID = -7969552014686072721L; private String id; private String username; private String password; private String

原创 【云笔记1】Spring mvc环境搭建

Spring mvc环境搭建的具体步骤首先准备MySql5.5、Navicat、eclipse-jee、jdk1.8、apache-maven-3.5.4、apache-tomcat-8.5.46等1.配置jdk(1).新建JAVA_HOME添加;%JAVA_HOME%\bin(2).检验jdk是否配置成功2.安装eclipse3.配置maven(1).环境配置与jdk类似(2)...

原创 【CSS手册】css

CSS手册、

原创 【第一章】1+X证书复习html与css---1

初级考证复习材料考点有关html与css

原创 【第二章】HTML5页面元素及属性

列表元素ul元素无序列表是网页中最长用的列表，之所以成为“无序列表”，是因为其各个列表项之间没有顺序级别之分，通常是并列的。<ul> <li>列表一<li> <li>列表二<li> <li>列表三<li> </ul>ol元素有序列表级为有排列顺序的列表，其各个列表按照一定的顺序...

原创 【HTML5】初识HTML5+HTML5页面元素及属性2-思维导图

思维导图

原创 【HTML5】初识HTML5+HTML5页面元素及属性1

初识HTML51 HTML5概况HTML5是超文本标记语言Hyper Text Markup Language）的第5代版本，目前还处于推广阶段。在HTML5平台上，视频、音频 图像,动画及同电脑的交互都被标准化。1.1HTML5发展历程2014年10月29日，万维网联盟宣布，经过八年的艰辛努力，HTML5标准规范终于指定完成，并公开发布。1.2HTML5的优势从HTML...

原创 【第六章】综合实例：删除记录时的提示效果

综合实例：删除记录时的提示效果在删除数据时，通常会给出友好的用户提示信息，待用户确认时，再删除数据，这种提示信息可以使用 JavaScript的 confrm 确认框实现，也可以用div+cs自己制作，之后通过jQuery来操作div元素的显示与隐藏。本实例的需求如下:单击“删除”按钮时，显示删除提示框，用户可以单击“确认”或“取消”按钮，也可以单击右上角的“×”来关闭提示框。当...

原创 【第六章】使用jQuery操作表单和表格3

表单验证<form> <h2 align="center">用户注册</h2> <div class="dt">用户名：<input type="text" id="username" name="username" size=20 class="required" /></div> <div class=...

原创 【第六章】使用jQuery操作表单和表格2

使用jQuery操作表单元素操作文本框1.获取文本框的值var textCon =$("#id").val();或者：var textCon=$("#id").attr("value");2.设置文本框的值，可以使用attr()方法$("#id").attr("value","要设定的值");3.设置文本框不可编辑的方法：$("#id").attr("disabled","...

原创 【第六章】使用jQuery操作表单和表格1

HTML表单概述当用户填写完信息后做提交操作，将表单内的内容从客户端的浏览器传到服务器上，经过服务器处理程序后，再将用户所需信息传送回客户端的浏览器上，这样网页就具有了交互性。、表单的主要功能是收集信息，具体说是收集浏览者的信息。一表单标记form1.action属性action属性是指处理表单提交数据的脚本文件。 具体语法： <form action="URL"...

原创 【第五章】综合实例：实现图片传送带

实现图片传送带所谓图片传送带是指在页面的指定位置固定显示一定数量的图片（其他图片隐藏）单击最左边的图片时，全部图片均向左移动一张图片的位置，单击最右边的图片时，全部图片均向右移动一张图片的位置，这样既可以查看到全部图片，又能节省页面空间，比较实用。将鼠标移动到左边的图片上，将显示图的箭头，单击将向左移动一张图片；将鼠标移动到右边的图片上时，将显示向右的箭头，单击将向右移动一张图片；单击中间...

原创 【第五章】jQuery动画的效果思维导图

原创 【第五章】jQuery中事件处理和动画效果3

jQuery中的动画效果5.2.1隐藏匹配元素hide()方法相当于元素css样式属性display的值设置为none，他会记住原来的display的值。hide()方法有两种语法格式：1.hide();2.hide(speed,[callback])speed:指定动画时长。 callback:可选参数，用于隐藏完成后要触发的回调函数。jQuery的任何动画效果，都可以使用默认的3...

原创 【第五章】jQuery中事件处理和动画效果2

事件冒泡与事件捕获通过一个形象的元素结构，展示冒泡模事件对象：是在不同浏览器中获取事件对象是比较困难的，在jQuery进行了处理，只要为函数添加一个参数即可。编写CSS样式<style> body{ font-size: 12px; } .redBorder{ /*类样式*/ border:1px solid re...

原创 【第五章】jQuery中的事件处理和动画效果

5.1jQuery中的事件处理5.1.1 页面加载响应事件$(document) .ready()方法是事件模块中最重要的一个函数，它极大地提高了Web响应速度。 $(document) 是获取整个文档对象，从这个方法名称来理解，就是获取文档就绪的时候。书写格式：$(document).ready(function(){//在这里编写代码});可以简写成：$().ready(fu...

原创 【第四章】使用jQuery操作DOM

对元素内容操作元素内容是指定义元素的起始标记和结束标记中间内容，可分为文本内容和HTML内容<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>对元素内容操作</title> <script language="JavaScript...

原创 【第三章】jQuery选取器导图

原创 【第三章】jQuery选择器的使用4

【综合实例】隔行换色鼠标指向表格换行本实例的需求主要有以下两点:(1)在页面中创建一个表格,令表格奇数行显示黄色,偶数行显示浅蓝色;(2)当鼠标指向某一行时,该行颜色随之改变。 table{ border: 0; border-collapse: collapse;/* 设置表格整体样式 */ } td{ font:normal 12px/17...

原创 【第三章】jQuery选择器的使用3

过滤选择器1.简单过滤器简单过滤器是以冒号开头，通常用于实现简单过滤效果的过滤器【案例3-10】 td{ font-size: 12px; padding: 3px; } .th{ background-color: darkcyan;//设置背景色 font-weight: bold; text-align: center; ...

原创 【第三章】jQuery选择器的使用2

使用选择器隐藏超链接地址在网页中，如果将鼠标移动到一个超链接上时，浏览器的状态栏中将显示该链接所指向的链接地址。【案例】<body> <a href="10242.html" class="main">注册</a> <script> $(document).ready(function(){ $("a.main").mouse...

原创 【第三章】jQuery选择器的使用

1.jQuery的工厂函数2.jQuery的五种基本选择器ID选择器元素选择器类名选择器复合选择器通配符选择器

原创 jQuery开发基础【第二章】初识jQuery

初识jQueryjQuery概述jQuery是一套简洁、快速、灵活的JavaScript脚本，帮助人们简化JavaScript代码。jQuery能做什么动画效果例如：中国网络电视台、CCTV、京东网上商城、人民网等。jQuery的特点代码小巧精致强大的功能函数跨浏览器链式的语法风格我的第一个jQuery脚本<!DOCTYPE html><ht...

原创 【第九章】正则表达式（【案例】限定输入内容）

限定输入内容利用正则表达式限定输入框中只能输入4位数表示年份和1位2位数字表示月份//编写css样式<style> input[type=text]{width: 40px;border-color: #bbb;height: 25px;font-size: 14px;border-radius: 2px;outline: 0;border: #ccc 1px s...

原创 【第九章】正则表达式

正则表达式正则表达式 是一种描述字符串结构的语法规则，是一个特定的格式化模式，用于验证各种字符是否匹配这个特征，进而实现高级的文本查找、替换、截取内容等操作。//exec()方法<script> var str='AbC123abc456'; var reg= /abc/i;//i表示不区分大小写 console.log(reg.exec(str)); ...

原创 【第八章】事件----事件分类

事件分类8.3.1页面事件在项目开发中，经常需要JavaScript对网页中的DOM元素进行操作，而页面的加载又是按照代码的编写顺序，从上到下进行的。因此，若在页面还未加载完成的情况下，就使用JavaScript操作DOM元素，会出现语法错误，代码如下。<script> document.getElementById('demo').onclick = functio...

原创 JavaScript【第八章】事件---事件处理与事件对象

事件事件被看作是JavaScript与网页之间交互的桥梁，当事件发生时，可以通过JavaScript代码执行相关的操作。例如：用户可以通过鼠标拖拽登录框，改变登录框的显示位置；或者是在阅读文章时，选出文本后自动弹出分享、复制选项等。事件可被理解为是JavaScript侦测到的行为，这些行为指的就是界面的加载、鼠标单击页面、鼠标滑过某一个区域等具体动作。事件处理...

原创 【案例】标签栏切换效果

标签栏在网站中的使用非常普遍，他的优势在于可以在有限的空间内展示多块的内容，用户可以通过标签栏在多个内容块之间进行切换。编写HTML代码，实现静态页面，同时也添加current样式，同样的在tab-boby盒子里也添加current样式<div class="tab-box"> <div class="tab-head"> <div class="t...

原创 元素样式

元素的样式对于元素对象的样式，可以直接通过“style.属性名称”的方式操作。在操作样式名称时，需要去掉CSS样式名里中的横线“-”，并将第二个英文首字母大写。例如：设置背景颜色的background-color,在style属性操作中，需要修改"backgroundColor"。编写css代码编写不同类选择器的CSS样式<style> .bg{background:...

原创 【案例】滚动的小球

实现DOM元素的动画特效是JavaScript的常见功能之一。实现的原理是通过定时器连续的修改当前的DOM元素的某个样式值，达到一个动态的特效。其中target表示目标点，leader表示起点，step表示从起点到目标点每次缓动的步长。通过html页面编写一个id名为box 的小球，编写他的css样式。 #box{position:absolute; width:150px; ...

原创 document对象的方法

<div id="box">box</div> <div class="bar">bar</div> <div name="main">main</div><script> console.log(document.getElementById('box')); console.lo...

原创 DOM对象的继承关系

DOM可以用于完成HTML和XML文档的操作。例如改变盒子的大小、标签栏、购物车等。