js
js部分的代码写在body之间
首先写<script>
删除属性
delete obj.sex;
添加引号用到转义符
obj="ab\"\"c";
对数组的处理 5个函数
(1)数组添加元素
从头部添加
arr.unshift("头部");
console.log(arr);
(2)从尾部添加
arr.push("尾部");
console.log(arr);
(3)从头部删除
arr.shift();
console.log(arr);
(4)从尾部删除
arr.pop();
console.log(arr);
(5)删除并插入
arr=[1,2,3,4];
//删除下标位置以及其后所有元素
arr.splice(1);//把下标为1的后面的元素都删除
console.log(arr);//1
arr=[1,2,3,4];
arr.splice(1,2);//删除下标位置,删除指定个数
console.log(arr);//1,4
arr=[1,2,3,4];
arr.splice(1,0,33,44,55);//删除下标位置,删除指定个数 添加元素
console.log(arr);//1,33,44,55,2,3,4
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<button type="button" onclick="easymethod()">点击</button>
<!-- js写在body的最下面 -->
<script>
// js代码
function easymethod(){ <!-- 脚本 -->
// 在浏览器的控制台打印测试数据
console.log("this is easymethod");
// 声明对象
// js是一种弱类型语言 界限不明显
// 局部变量
let obj={};
//常量
const username="张三";
//变量
var sex="男";
obj.name="李四";
obj.name="张三";//设置属性
obj.study=function(){
}
obj["sex"]="男";
var proName="sex";
obj[proName]="nv";
// 删除属性
delete obj.sex;
//添加引号用到转义符
obj="ab\"\"c";
console.log(obj);
method(12,23,34);
}
const sysName="水果管理系统";
var method=function(a,b){
if(a){
console.log(true);//a有值就为true
}else{
console.log(false);
}
console.log(a+"=====");
console.log(b+"=====");
console.log(arguments);//method中剩余的数可以当做数组或可变参数
}
var str="123";
console.log(typeof str);//typeof 后面可以跟对象或者变量
//返回这个变量的类型的名称
num=123;
console.log(typeof num);
num=123.33;
console.log(typeof num);
//对数组的处理 5个函数
arr=[12,34];
console.log(arr);
arr[8]=99;
arr[3]="你好";
arr[4]={};
console.log(arr);
//数组添加元素
//从头部添加
arr.unshift("头部");
console.log(arr);
//从尾部添加
arr.push("尾部");
console.log(arr);
//从头部删除
arr.shift();
console.log(arr);
//从尾部删除
arr.pop();
console.log(arr);
//删除并插入
arr=[1,2,3,4];
//删除下标位置以及其后所有元素
arr.splice(1);//把下标为1的后面的元素都删除
console.log(arr);//1
arr=[1,2,3,4];
arr.splice(1,2);//删除下标位置,删除指定个数
console.log(arr);//1,4
arr=[1,2,3,4];
arr.splice(1,0,33,44,55);//删除下标位置,删除指定个数 添加元素
console.log(arr);//1,33,44,55,2,3,4
</script>
</body>
</html>
DOM :Document Object Model
//clickme();
获取Dom组件对象
var btn=document.getElementById("btn");
btn.οnclick=clickme;
document.getElementsByClassName("");//通过class
document.getElementsByName("");//通过name属性
document.getElementsByTagName("");//通过标签名
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="box">没有好吃的</div>
<button type="button" id="btn" >请点击</button>
<script>
//DOM Document Object MOdel
function clickme(){
console.log("OK");
let box=document.getElementById("box");
// box.innerHTML="<h1>好困</h1>"
box.innerText="<h1>好困</h1>"
}
// clickme();
//获取dom组件对象
var btn=document.getElementById("btn");
btn.onclick=clickme;
document.getElementsByClassName("");//通过class
document.getElementsByName("");//通过name属性
document.getElementsByTagName("");//通过标签名
</script>
</body>
</html>
例子:随机抽号
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
.maxBox {
padding: 4px 6px;
font-size: 16px;
color: #3EAFE0;
}
.clickBtn {
border: 1px solid #3EAFE0;
background-color: #3EAFE0;
color: #FFF;
font-size: 14px;
padding: 4px 6px;
}
.result {
font-size: 80px;
color: #3EAFE0;
font-weight: bold;
padding: 30px;
}
.txt_center {
text-align: center;
}
.exist {
border: 1px solid #EEE;
padding: 20px;
margin: 20px auto;
width: 600px;
min-height: 100px;
text-align: left;
}
.exist span {
display: inline-block;
padding: 2px 10px;
margin: 4px;
border-radius: 3px;
background-color: #3EAFE0;
color: #FFFFFF;
}
.info {
border: 1px solid blue;
color: #000;
font-weight: 500;
padding: 20px;
margin: 20px auto;
width: 600px;
}
</style>
</head>
<body>
<div class="txt_center">
<div class="result">
<span class="" id="result">0</span>
</div>
<input class="maxBox" type="text" id="txt" placeholder="请在里面输入号码最大值!">
<input class="clickBtn" type="button" id="btn" value="抽号">
<div class="exist">
<div>已抽取:</div>
<div id="exist">
<span>23</span>
<span>65</span>
<span>12</span>
</div>
</div>
</div>
<!--练习说明-->
<div class="info">
1、在文本框中输入抽号最大值
<br/> 2、点击按钮,开始抽号,随机生成1~最大值之间的整数
<br/> 3、已经抽取的号码存入一个数组
<br/> 4、为了保证号码的唯一性,每次生成一个号码,跟数组中的已抽取的号码比对
<br/> 5、如果已存在,重新生成号码
<br/> 6、如果不存在,放入数组中保存,并显示出来
<br/> 7、将号码结果放入result中显示出来
<br/> 8、将已经生成的号码(数组)存入exist中显示出来
<br/> 9、给抽号按钮添加一个3s倒计时,倒计时结束前不可点击按钮
</div>
<script>
const btn=document.getElementById("btn");
const txt=document.getElementById("txt");
const result=document.getElementById("result");
const exist=document.getElementById("exist");
const arr=[];
var start=false;
btn.onclick=method;
function method(){
//获取输入框中的内容(数字)
var val=txt.value;
//输入框中没有数据,提示填入数据
if(!val){
alert("输入内容");
}else{
//如果有数据
if(!start){
//如果不是开始状态.就要初始化并抽号
//初始化设置开始
start=true;
txt.setAttribute("readonly","readonly");
//准备数组
for(let i=1;i<=val;i++){
arr[i-1]=i;
}
console.log(arr);
//清空之前抽取出来的部分
exist.innerHTML="";
}
//如果是启动状态,并且数组中没有可选元素
//回复可填入状态
if(start&&arr.length==0){
//输入框清空
txt.value="";
//输入框删除readonly
txt.removeAttribute("readonly");
//状态改为false;
start=false;
//结束方法
return ;
}
//数字跳动起来
var interval=setInterval(function(){
let ran=Math.floor(Math.random()*(arr.length));
let num=arr[ran];
//将内容显示到result中
result.innerText=num;
},100);
setTimeout(function(){
//清空之前的计时显示
clearInterval(interval);
//如果是开始状态,就开始抽号
//随机下标
let ranIndex=Math.floor(Math.random()*(arr.length));
// console.log(ranIndex);
//获取下标位置的内容
let num=arr[ranIndex];
//将内容显示到result中
result.innerText=num;
//追加到exist中
exist.innerHTML=exist.innerHTML+"<span>"+num+"</span>"
//将该位置的元素删除掉
arr.splice(ranIndex,1);
//要有一个数组,如果没有数据,提示已经抽完,并且将状态改为false
console.log(arr);
},300);
}
}
// function easymethod(){
// }
// setInterval(easymethod)
// setInterval(function(){
// console.log(Math.random());
// },300)//每隔多久执行
setTimeout(function(){console.log(Math.random());},1000)//延迟多少时间执行
</script>
</body>
</html>
MYSQL
打开cmd输入命令 yaql -u root -p 进入mysql
打开Navicat Premium可视化工具
1 .数据库操作
(1)创建数据库
create database <数据库名>
例:create database easydata;
(2)删除
drop database <数据块名>
(3)查看所有的数据库
show databases;
(4)选择
use <数据库名>
2.表是数据库中存储数据的主体
创建表 表名 t_user user
create table staff()
表中字段:1. id是表中的主键 表中数据唯一的标识,是不可重复的,不可为null
2.auto_increment 在插入数据室,该列的值可以不指定,会自动递增
(1)创建了一个名为 id
的整数类型的列,这个列会被自动设置为递增的值,并且作为表的主键
id int auto_increment PRIMARY KEY,
(2)varchar(最大长度) 可变字符串类型
code varchar(20) not null,
name varchar(20) not null,
(3)创建了一个名为 salary
的列,它可以存储最多 10 位数字的数值,其中小数点后保留两位。
salary DECIMAL(10,2)
这个表完整创建:
create table staff (
-- 表中字段
-- 1. id是表中的主键 表中数据唯一的标识 不可重复的
-- 不可为null值
-- 2. auto_increment 在插入数据时,该列的值可以不指定,会自动递增
id int auto_increment PRIMARY KEY,
-- varchar(最大长度) 可变字符串类型
code varchar(20) not null,
name varchar(20) not null,
-- 代表数值一共可以存储10位,其中两位用来存储小数
salary DECIMAL(10,2)
)
(4)重命名表
alter table staff rename to t_staff;
alter table t_staff rename as staff;
(5)设置编码
-- mysql utf8 mb3 mb4 maxbyte
-- 不同的字符占用的空间是不一样的
-- 数字,字母,欧洲部分语言字符占一个字节
-- 中东的阿拉伯语言 占两个字节
-- 中文,韩文,日文,东南亚地区字符 占3个字节alter table staff character set utf8mb3;
(6)添加一个列
alter table staff add column sex varchar(2);
(7)(对某一个列重新定义)重新定义列
alter table staff modify sex varchar(20) not null;
(8)定义列的位置
alter table staff modify sex varchar(20) not null after name ;
(9)列重命名
alter table staff change sex age int not null;
(10)删除列
alter table staff drop column age;
(11)在起名 列名 表名时经常会用到一些关键字 name 使用 `标识
create table `table`(
`varchar` varchar(20)
)
(12)删除表
drop table `table`;