emlog模板-新拟态效果
emlog模板-新拟态效果
模板图片 关于模板 该模板基于Emlog默认模板开发,暂时没添加什么新功能,模板交流群:138778739,欢迎大家反馈问题! 更新内容 2022-05-23 首页不完全显示 手机端不显示侧边栏 首页描述超出 2022-5-25 首页新增笔记 优化阅读文章页面样式 模板下载 正版用户直接在模板商店下载即可,盗版用户勿扰!
 2022-5-23
Es6语法笔记(部分)
Es6语法笔记(部分)
Es6语法介绍 ES6, 全称 ECMAScript 6.0 ,是 JavaScript 的下一个版本标准,2015.06 发版。 ES6 主要是为了解决 ES5 的先天不足,比如 JavaScript 里并没有类的概念,但是目前浏览器的 JavaScript 是 ES5 版本,大多数高版本的浏览器也支持 ES6,不过只实现了 ES6 的部分特性和功能。 完整代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <style> .box-item{ width:100px; background-color: aquamarine; height: 50px; text-align: center; line-height: 50px; margin: 10px; } #ad{ width: 200px; height: 200px; background-color: bisque; } </style> <body> <div class="box-item">1</div> <div class="box-item">2</div> <div class="box-item">3</div> <div id="ad"></div> <script> //let小demo item = document.getElementsByClassName("box-item"); for (let i = 0; i < item.length; i++) { item[i].onclick=function(){ this.style="background-color:red"; this.innerText="我被点击了" } } // 数组的解构 const F4 = ['小沈阳','刘能','赵四','宋小宝']; let [xiao,liu,zhao,song]=F4; console.log(xiao); console.log(liu); console.log(zhao); console.log(song); // 对象的解构 const zhaobs = { name:'赵本山', age:'不详', xiaoping:function(){ console.log("我也可以演小品") } } let {name,age,xiaoping}=zhaobs; console.log(name); console.log(age); console.log(xiaoping); xiaoping(); // es6引入新的声明字符串的方式【``】 // 1.声明 let str = `我是字符串`; console.log(str,typeof str) // 2.内容中可以直接出现换行符 let strTwo = ` <ul> <li>box1</li> <li>box2</li> <li>box3</li> </ul>`; // 3.变量拼接 let lovest = '杨幂'; let out = `${lovest}是我最喜欢的演员`; console.log(out) // Es6 允许在大括号里面,直接写入变量和函数,作为对象的属性和方法。 // 这样写更简洁 let namee = '大彭Sir'; let change=function(){ console.log('我贼能吃!!!') } const bi ={ namee,change} console.log(bi) // Es6允许使用箭头(=>)定义函数。 let fn = (a,b) => { return a+b; } let sum = fn(10,20) console.log(sum) // this是静态的.this始终指向函数声明时所在作用域下的this得值 function getName(){ console.log(this.name); } let getName2 = () =>{ console.log(this.name);//无法改变指向 } window.name = '彭Sir' const es = { name:'PengSir' } getName.call(es); getName2.call(es); // 不能作为构造函数实例化对象 // let person = (name,age) =>{ // this.name = name; // this.age = age; // } // let me = new person('xiao',30); // person is not a constructor // console.log(me); // 箭头函数的简写,当型参有且只有一个可以省略括号 let add = n =>{ console.log(n+n) } add(1) // 当代码体只有一条语句的时候可以省略花括号,return必须省略 // 语句执行结果就是函数的返回值 let pow = n =>n*n; console.log(pow(10)); // 箭头函数demo // 需求一:点击div 2s 后颜色变成 粉色 let ad = document.getElementById('ad'); ad.onclick = function(){ setTimeout(()=>{ this.style.background="pink" },2000) } // 需求二:从数组中返回偶数的元素 const arr = [1,6,9,10,100,25]; // 普通方法 // const result = arr.filter(function(item){ // if (item % 2 === 0) { // return true // } else{ // return false; // } // }); // 箭头函数 const result =arr.filter(item=>item%2===0) console.log(result) // 箭头函数适合与this无关的回调。定时器、数组方法的回调 // 箭头函数不适合与this有关的回调。时间回调,对象的方法 </script> </body> </html>
 2022-5-21
MyBatis动态SQL实现
MyBatis动态SQL实现
创建数据库 t_user库的名称 手动创建库 user 表名 /*SQLyog Ultimate v12.09 (64 bit) MySQL - 5.5.62 : Database - t_user ********************************************************************* */ /* !40101 SET NAMES utf8 */; /* !40101 SET SQL_MODE=''*/; /* !40014 SET @OLD_UNIQUE_CHECKS=@@UNIQUE_CHECKS, UNIQUE_CHECKS=0 */; /* !40014 SET @OLD_FOREIGN_KEY_CHECKS=@@FOREIGN_KEY_CHECKS, FOREIGN_KEY_CHECKS=0 */; /* !40101 SET @OLD_SQL_MODE=@@SQL_MODE, SQL_MODE='NO_AUTO_VALUE_ON_ZERO' */; /* !40111 SET @OLD_SQL_NOTES=@@SQL_NOTES, SQL_NOTES=0 */; CREATE DATABASE /* !32312 IF NOT EXISTS*/`t_user` /* !40100 DEFAULT CHARACTER SET utf8 COLLATE utf8_bin */; USE `t_user`; /*Table structure for table `user` */ DROP TABLE IF EXISTS `user`; CREATE TABLE `user` ( `id` int(11) NOT NULL AUTO_INCREMENT, `username` varchar(20) COLLATE utf8_bin DEFAULT NULL, `password` varchar(20) COLLATE utf8_bin DEFAULT NULL, PRIMARY KEY (`id`) ) ENGINE=InnoDB AUTO_INCREMENT=14 DEFAULT CHARSET=utf8 COLLATE=utf8_bin; /*Data for the table `user` */ insert into `user`(`id`,`username`,`password`) values (1,'tom1','123'), (2,'tom2','123'),(3,'tom3','123'),(4,'tom4','123'),(5,'tom5','123'), (6,'tom6','123'),(7,'tom7','123'),(8,'tom8','123'),(9,'tom9','123'), (10,'tom10','123'),(11,'tom11','123'),(12,'tom12','123'),(13,'tom13','123'); /* !40101 SET SQL_MODE=@OLD_SQL_MODE */; /* !40014 SET FOREIGN_KEY_CHECKS=@OLD_FOREIGN_KEY_CHECKS */; /* !40014 SET UNIQUE_CHECKS=@OLD_UNIQUE_CHECKS */; /* !40111 SET SQL_NOTES=@OLD_SQL_NOTES */; 根据用户名或密码查询 * 一个条件都没有 * 只有用户名,没有密码 * 用户名 和 密码 都有 编写接口Usermapper //条件 public List<User> findUserByUserNameOrPws(User user); 编写sql语句 usermapper.xml中 <!--条件查询--> <select id="findUserByUserNameOrPws" resultType="user" parameterType="user"> /*username 参数对象user 中的属性 */ select * from user <where> <if test="username!=null"> and username=#{username} </if> <if test="password !=null"> and password=#{password} </if> </where> </select> 测试代码 findUser()只看这个方法 package com.haha.controller; import com.haha.domian.User; import com.haha.mapper.UserMapper; import org.apache.ibatis.io.Resources; import org.apache.ibatis.session.SqlSession; import org.apache.ibatis.session.SqlSessionFactory; import org.apache.ibatis.session.SqlSessionFactoryBuilder; import java.io.File; import java.io.IOException; import java.io.InputStream; import java.util.List; public class TestMain { public static void main(String[] args) throws IOException { //1.查询所有数据 //list(); //2.查询数据 findUser(); } //条件查询用户 public static void findUser()throws IOException{ SqlSession sqlSession = getSqlSession(); UserMapper mapper = sqlSession.getMapper(UserMapper.class); User user=new User(); user.setUsername("tom10"); List<User> list = mapper.findUserByUserNameOrPws(user); System.out.println(list); } //查询所有数据 public static void list()throws IOException{ SqlSession sqlSession = getSqlSession(); UserMapper mapper = sqlSession.getMapper(UserMapper.class); List<User> all = mapper.findAll(); System.out.println(all); } //获取到sqlsession对象 public static SqlSession getSqlSession() throws IOException { InputStream resourceAsStream = Resources.getResourceAsStream("sqlMapConfig.xml"); SqlSessionFactory sqlSessionFactory = new SqlSessionFactoryBuilder().build(resourceAsStream); SqlSession sqlSession = sqlSessionFactory.openSession(); return sqlSession; } } 批量查询 例子: select * from user where id in(1,3,5,6) 编写接口 public List<User> findByIds(List<Integer> list); 编写sql语句 <!--批量查询 根据id--> <select id="findByIds" resultType="user" parameterType="list"> /*select * from user where id in (xx,xxx)*/ select * from user <where> <foreach collection="list" open="id in (" close=")" item="id" separator=","> #{id} </foreach> </where> </select> 测试代码 //批量查询id的值 public static void findUserByids()throws IOException{ SqlSession sqlSession = getSqlSession(); UserMapper mapper = sqlSession.getMapper(UserMapper.class); List<Integer> list=new ArrayList<>(); list.add(1); list.add(3); list.add(5); List<User> users = mapper.findByIds(list); System.out.println(users); }
 2022-5-13
uni-app请求封装
uni-app请求封装
案例简介 基于promise封装请求,使用async await语法糖,参考插件市场,插件ID:niudandan-promise 详细使用 api.js const BASE_URL = '你的域名'; export const myRequest = (options)=>{ let token = uni.getStorageSync('token') return new Promise((resolve,reject)=>{ uni.request({ url: BASE_URL + options.url, // 将接口地址分为两部分,这样如果域名改变了好维护,接口地址从options中获取 header: { token: token, } || {}, method: options.method || 'GET',//默认Get data: options.data || {},// data从options中获取,如果没有传入data, 则默认一个空对象 success: (res) => { if (res.data.code === 1401) { } else { res } resolve(res); }, fail: (err) => { uni.showToast({ title: '请求接口失败', }); reject(err); }, }); }) } main.js //这个方法可能每个页面都会用到,我们可以在main.js中引入, import {myRequest} from 'api.js' //接收之后,挂载到全局,这样所有的页面都可以调用这个方法 Vue.prototype.$myRequest = myRequest; 使用方法:使用this.$myRequest进行调用 <button type="submit" @click="test()">发送请求</button> methods: { async test() { const res = await this.$myRequest({ url: '/api.php' }) this.dataa = res.data } }
 2022-5-11
Vue 服务端渲染
Vue 服务端渲染
小案例 // 1.创建vue实例 const Vue = require('vue') const server = require('express')() // 2.读取模板 const renderer = require('vue-server-renderer').createRenderer({ template:require('fs').readFileSync('./template.html','utf-8') }) // 3.处理Get方式请求 server.get('*',(req,res)=>{ res.set({'Content-Type':'text/html;charset=utf-8'}) const vm = new Vue({ data:{ title:'当前位置', url:req.url }, template: '<div>{{title}}:{{url}}</div>' }) // 4.将Vue 实例渲染为Html后输出 renderer.renderToString(vm,(err, html) => { if (err){ res.status(500).end('err'+err) return } res.end(html) }) }) server.listen(8080,function () { console.log('server started at localhost:8080') }) 模板文件 <!DOCTYPE html> <html> <head> <title>Title</title> </head> <body> <!--vue-ssr-outlet--> </body> </html>
 2022-5-10
自动化测试
自动化测试
案例代码 import time from selenium import webdriver; from selenium.webdriver.common.action_chains import ActionChains # 获取谷歌驱动 drive = webdriver.Chrome(); # 2.打开百度 drive.get('http://www.baidu.com'); time.sleep(2) # 窗口放大 drive.maximize_window() # 3.找到百度的输入款 # bdEL = drive.find_element_by_id('kw') # time.sleep(3) action = ActionChains(drive); # 4.右键 执行方法 # action.context_click(bdEL).perform() # 5.双击事件 # bdEL.send_keys('tomcat8') # action.double_click(bdEL).perform() # 6.拖拽事件 # drive.get(r'C:\Users\Administrator\Desktop\软件测试\html\drop.html') # 获取到盒子div的元素对象 # div1 = drive.find_element_by_id('div1') # div2 = drive.find_element_by_id('div2') # action = ActionChains(drive); # 将div1拖拽到div2里面 # time.sleep(3) # action.drag_and_drop(div1,div2).perform() #鼠标悬停 gd = drive.find_element_by_id('s-usersetting-top') action.move_to_element(gd).perform() 弹窗 drive.find_element_by_id('alerta').click() time.sleep(2) # drive.switch_to_alert()过时 # 获取到alert对象 alert = drive.switch_to.alert # 点击弹框的确定 alert.accept() 执行js脚本 js2 = 'alert("哈哈")' time.sleep(2) # 执行js脚本 drive.execute_script(js) 在当前页面中找到其他页面 drive.get(r'C:\Users\Administrator\Desktop\素材\注册2实例.html') time.sleep(2) # 切换到a页面 drive.switch_to.frame('myframe1') drive.find_element_by_id('userA').send_keys("admin") # 切换到原来的页面 drive.switch_to.default_content() drive.find_element_by_id("user").send_keys("大彭Sir")
 2022-5-10
node根据不同路径跳转到指定的页面
node根据不同路径跳转到指定的页面
完整代码 //1.引入http的模块 var http= require('http'); var fs=require('fs');//读取页面内容 var path=require('path');//拼接 const { throws } = require('assert'); //2.创建服务器 var server= http.createServer(); //3.启动服务器 server.listen(3000,function () { console.log('server .... start.. success'); }); //4.监听客户发送过来的请求,并相应数据给客户端 request(请求对象) response(响应对象) server.on('request',function (request,response) { //获取的请求路径 var url= request.url; //响应乱码处理 //response.setHeader("cont") if(url==='/login'){ //读取文件 nodeDeme/static/login.html fs.readFile(path.join(__dirname,'static/login.html'),'utf8',function (err,data) { if(err){ throw err; } response.end(data); }); }else if(url==='/register'){ fs.readFile(path.join(__dirname,'static/register.html'),'utf8',function (err,data) { if(err){ throw err; } response.end(data); }); } else if(url==='/'){ fs.readFile(path.join(__dirname,'static/index.html'),'utf8',function (err,data) { if(err){ throw err; } response.end(data); }); } else if(url==='/add'){ fs.readFile(path.join(__dirname,'static/add.html'),'utf8',function (err,data) { if(err){ throw err; } response.end(data); }); }else { fs.readFile(path.join(__dirname,'static/404.html'),'utf8',function (err,data) { if(err){ throw err; } response.end(data); }); } }); 改进之后 //1.引入http模块 path模块(拼接路径) fs模块 文件读写 var http = require('http'); var fs = require('fs'); var path = require('path'); const { ifError } = require('assert'); //2.创建服务器 var serve = http.createServer(); //3.启动服务器 serve.listen(3000,function(){ console.log('server start success!') }); //4.监听客户端发来的请求 serve.on('request',function(request,response){ //获取请求路径 var url = request.url; //根据不同的请求,找对应的页面 var filepath; if(url==='/'){ filepath = path.join(__dirname,'public/index.html'); //读取页面内容 fs.readFile(filepath,'utf8',function(err,data){ if(err){ throw err; }else{ response.end(data); } }) }else{ if(url.indexOf('.')>=0){ filepath= path.join(__dirname,'public',url); }else{ filepath= path.join(__dirname,'public',url+'.html'); } //读取页面内容 fs.readFile(filepath,'utf8',function(err,data){ if(err){ throw err; }else{ response.end(data); } }) } })
 2022-5-7
    组件
    JSP
    微信小程序
    箭头函数
    node
    正则表达式
    微信
    js
    铭记
    Mybatis
    MYSQL
    编程
    空间
    ajax
    图形
    晚安心语
    Spring-MVC
    名片赞助手
    三层架构
    uniapp
    css
    数据库
    Downie4
    电脑
    Emlog小程序
    VuePress
    插件
    axios
    前端
    自动化测试
    HTML
    Servlet
    SQL
    Python
    插槽
    页面
    emlog
    PhotoShop
    软件
    IO流
    图片上传
    邮箱验证
    QQ小程序
    说说
    表白墙
    Brief
    PS
    表单提交
    javaScript
    Java
    Mac
    jQuery
    代码
    九一八事变
    nodejs
    文章
    VUE
    promise
    封装
    教程
    下载
    Vuex
    robots
    缓存
    新拟态效果
    测试
    安装
    爬虫
    SSM
    伪静态
    源码
    QQ
    弹性布局
    递归算法
    教学
    Es6
    Spring
    Json
    Vue脚手架
    工具
    铭记国耻
    心情
    笔记
    PHP
    内容安全
    SEO
    服务端
    QQx
    代码高亮
    墨菲定律
    Fabric
    小程序
    系统
    事件
    模板
    web
    轮播图

Theme By Brief 鄂ICP备19010459号

站长统计 sitemap

首页

分类

友链

标签