最爱琴女E-CSDN博客

原创 Javascript笔记大全03

BOM简介BOM（Browser Object Model）即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象使window区别DOM文档对象模型DOM就是把【文档】当做是一个【对象】来看待DOM的顶级对象是documentDOM主要学习的是操作页面元素DOM是W3C标准规范BOM浏览器对象模型把【浏览器】当做是一个【对象】来看待BOM的顶级对象是windowBOM学习的是浏览器窗口交互的一些对象BOM是浏览器厂商在各自浏览器上定义的，兼容性较差

2021-08-14 16:30:02 495

原创 Javascript笔记大全02

DOM简介文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标记语言（HTML或者XML）的标准编程接口DOM树窗口加载事件// 为window绑定一个onload事件window.onload = function() {}或者window.addEventListener('load',function() {});// 该事件对应的响应函数将会在页面加载完成之后执行// 这样可以确保我们的代码执行时所有的DOM对象已经加载完毕了

2021-08-03 17:58:32 401

原创 Javascript笔记大全01，会持续更新~

JS的组成ECMAScript：JavaScript语法DOM：页面文档对象模型BOM：浏览器对象模型注释<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript"> // 1.单行注释 Ctrl + / /* 2.多行注释

2021-07-26 20:45:48 446

原创 HTML+CSS笔记大全，之后会持续更新~

HTML第一个HTML页面<!doctype html><html>  <head>  <title>网页的标题</title> </h

2021-07-23 18:39:20 835 1

原创 Js笔记05

简单类型与复杂类型简单类型又叫做基本数据类型或者值类型，复杂类型又叫做引用类型值类型：简单数据类型/基本数据类型，在存储时变量中存储的是值本身，因此叫做值类型string、number、Boolean、undefined、null引用类型：复杂数据类型，在存储变量中存储的仅仅是地址（引用），因此叫做引用数据类型通过new关键字创建的对象（系统对象、自定义对象），如Object、Array、Date等<!DOCTYPE html><html> <head>

2021-07-20 17:11:40 482 1

原创 Js笔记04

预解析JavaScript代码是由浏览器中的JavaScript解析器来执行的。JavaScript解析器在运行JavaScript代码的时候分为两步：预解析和代码执行<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript"> // 1 console.l

2021-06-29 14:46:47 130

原创 JS笔记03

数组数组是指一组数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型的元素//普通变量一次只能存储一个值var num = 10;//数组一次可以存储多个值var arr = [1,2,3,4,5];数组的创建方式JS中创建数组有两种方式：利用 new 创建数组利用数组字面量创建数组利用 new 创建数组var 数组名 = new Array();var arr = new Array();//创建一个新的空数组注意：Array()，A要大写利用数组字面量创建数

2021-06-25 15:46:47 420

原创 JS笔记02

算术运算符概念：算术运算使用的符号，用于执行两个变量或值的算术运算运算符描述实例+加10 + 20 = 30-减10 - 20 = -10*乘10 * 20 = 200/除10 / 20 = 0.5%取余数（取模）返回除去的余数9 % 2 = 1<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>

2021-06-18 17:02:02 312

原创 JS笔记01

初识Javascript作用：表单动态校验（密码强度检测）网页特效服务端开发（Node.js）桌面程序（Electron）App（Cordova）控制硬件-物联网（Ruff）游戏开发（Cocos2d-js）HTML/CSS/JS的关系HTML/CSS标记语言–描述类语言HTML决定网页结构和内容（决定看到什么），相当于人的身体CSS决定网页呈现给用户的模样（决定好不好看），相当于给人家穿衣服、化妆JS脚本语言–编程类语言实业业务逻辑和页面控制（决定功能），相当于人的各种动

2021-06-15 16:42:19 816 2

原创 CSS笔记11 2D与3D转换

2D转换转换（transform）是CSS中具有颠覆性的特征之一，可以实现元素的位移、旋转、缩放等效果移动：translate旋转：rotate缩放：scale移动translate2D移动是2D转换里面的一种功能，可以改变元素再在页面中的位置，类似定位语法transform:translate(x,y);或者分开写transform:translateX(n);transform:translateY(n);<!DOCTYPE html><html>

2021-06-13 17:36:21 200

原创练习---仿品优购项目

购物项目搭建工作1.需要创建如下文件夹名称说明项目文件夹shopping样式类图片文件夹images样式文件夹css产品类图片文件夹upload字体类文件夹fonts脚本文件夹js2.创建如下文件名称说明首页index.htmlCSS初始化样式文件base.cssCSS公共样式文件common.cssindex文件<!DOCTYPE html><html> &

2021-06-09 16:46:21 332

原创 CSS学习笔记10H5与CSS3的部分新特性

HTML5的新特性新增的语义化标签header ：头部标签nav ：导航标签article ：内容标签section ：定义文档某个区域aside ：侧边栏标签footer ：尾部标签注意：这种语义化标准主要是针对搜索引擎的这些新标签页面中可以使用多次在IE9中，需要把这些元素转换为块级元素其实，我们移动端更喜欢使用这些标签<!DOCTYPE html><html> <head> <meta charset="utf-8"&

2021-05-27 15:51:17 114

转载 CSS学习笔记9

精灵图精灵技术目的：为了有效地减少服务器接收和发送请求的次数，提高页面的加载速度精灵图的使用核心总结：精灵图主要针对于小的背景图片使用主要借助于背景位置来实现—background-position一般情况下精灵图都是负值（千万注意网页中的坐标：x轴右边走是正值，左边走是负值，y轴同理）<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>精灵图使用&lt

2021-05-27 15:42:36 152

原创 CSS学习笔记8 定位与显示、隐藏

定位将盒子定在某一个位置，所有定位也是在摆放盒子，按照定位的方式移动盒子定位 = 定位模式 + 边偏移定位模式用于指定一个元素在文档中的定位方式，边偏移则决定了该元素的最终位置定位模式定位模式决定元素的定位方式，它通过CSS的position属性来设置，其值可以分为四个：值语义static静态定位relative相对定位absolute绝对定位fixed固定定位边偏移边偏移就是定位的盒子移动到最终位置，有4个属性边偏移属性示例描

2021-05-18 15:54:56 290

原创 CSS学习笔记7PS切图与仿学成在线例子

PS切图常见的图片格式jpg，产品类的图片经常使用gif，实际经常用于一些图片小动画效果png，如果想要切成背景透明的图片，请选择png格式PSD，可以直接从上面复制文字，获得图片，还可以测量大小和距离PS有很多切图方式：图层切图、切片切图、PS插件切图等图层切图最简单的切图方式：右击图层—>快速导出为PNG但是很多情况下，我们需要合并图层再导出：选中需要的图层：图层菜单—>合并图层（Ctrl + e）右击—>快速导出为PNG切片切图利用切片选中图片

2021-05-15 15:10:24 309 1

原创 CSS学习笔记6

圆角边框（重点）在CSS3中，新增了圆角边框样式，这样我们的盒子就可以变圆角了语法border-radius:length;radius半径（圆的半径）原理：圆与边框的交集形成圆角效果<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>圆角边框</title> <style type="text/css"> .yuanxing

2021-05-11 16:10:26 145

原创 CSS学习笔记5CSS的三大特性与盒子模型

CSS的三大特性CSS有三个非常重要的特性：层叠性、继承性、优先级。层叠性相同选择器给设置相同的样式，此时一个样式就会覆盖（层叠）另一种冲突的样式。层叠性主要是解决样式冲突的问题层叠性原则：样式冲突，遵循的原则就是就近原则，哪个样式离结构近，就执行哪个样式样式不冲突，不会层叠<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>CSS层叠性</tit

2021-04-29 16:03:52 186

原创 CSS学习笔记4CSS的背景以及属性

CSS的背景通过背景属性，可以给页面元素添加背景样式背景属性可以设置背景颜色、背景图片、背景平铺、背景图片位置、背景图像固定等背景颜色background-color属性定义了元素的背景颜色background-color:颜色值;一般情况下元素背景颜色默认值是transparent（透明），我们也可以手动指定背景颜色为透明<!DOCTYPE html><html> <head> <meta charset="utf-8"> &lt

2021-04-19 16:13:19 137

原创 CSS学习笔记3Emmet语法、复合选择器、元素显示模式

Emmet语法快速生成HTML结构语法生成标签直接输入标签名按tab键即可，比如输入div然后按tab键，就可以生成了若想生成多个相同的标签，加上*就可以了，比如 div * 3（别有空格）再按tab键就可以快速生成3个div了若有父子级关系的标签，可以用> 比如 ul>li若有兄弟关系的标签，用+ 比如 div+p若生成带有类名或者id名字的，直接写 .demo 或者 #two tab键就可以了p.one按tab键后如下<p class="one"></

2021-04-15 16:27:42 218

原创 CSS学习笔记2字体属性和文本属性

CSS字体属性CSS Fonts（字体）属性用于定义字体系列、大小、粗细和文字样式字体系列CSS使用font-family属性定义文本的字体系列p { font-family:"微软雅黑";}div {font-family: Arial,"Microsoft Yahei","微软雅黑";}各种字体之间必须使用英文状态下的逗号隔开一般情况下，如果有空格隔开的多个单词组成的字体加引号尽量使用系统默认自带字体，保证在任何用户的浏览器中都能正确显示最常见的几个字体：body { font-f

2021-04-11 16:18:04 295

原创 CSS学习笔记1css引入方式和选择器

CSSCSS（Cascading Style Sheet）：层叠样式表语言CSS的作用：修饰HTML页面，设置HTML页面中的某些元素的样式，让HTML页面更好看。HTML引入CSS的三种方式第一种在标签内部使用style属性来设置元素的CSS样式，这种方式称为内联定义方式语法格式：<标签 style = "样式名:样式值; 样式名:样式值; 样式名:样式值; ..."></标签><!DOCTYPE html><html> <hea

2021-04-10 16:19:01 103 1

原创 HTML精简笔记

概述HTML：Hyper Text Markup Language（超文本标记语言）由大量的标签组成，每一个标签都有开始和结束标签HTML开发的时候使用普通的文本编辑器就行，创建的文件扩展名是.html或者.htmHTML也有专业的开发工具，例如：DreamWeaver、HBuilder…直接采用浏览器打开HTML文件就是运行第一个HTML页面<!-- 1.这是HTML的注释 2.加上以下代码的第一行就表示HTML5语法，去掉就表示HTML4.0 3.HTML不区分大小写，语法

2021-04-08 16:35:49 208 2

原创网络编程笔记

网络编程中的要素IP和端口号网络通信协议IPip地址：InteAddress唯一定位一台网络计算机127.0.0.1：本机localhostIP地址的分类IP地址分类ipv4 / ipv6ipv4：127.0.0.1 ,4个字节组成ipv6：128位，8个无符号整数公网（互联网）-私网（局域网）192.168.xx.xxx，专门给组织内部使用的ABCD类地址域名：记忆ip问题package lesson01;import java.ne

2021-02-07 17:04:36 52

原创 jQuery基础06

stop和delay方法<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>stop和delay方法</title> <style type="text/css"> *{ margin: 0; padding: 0; } .one{ width: 100px; height: 100px;

2021-02-06 15:16:05 131

原创 jQuery基础05

显示/隐藏动画<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>显示和隐藏动画</title> <style type="text/css"> *{ margin: 0; padding: 0; } div{ width: 200px; height: 200px; backgrou

2021-02-06 15:15:30 156

原创 jQuery基础04

电影排行榜练习<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>电影排行榜</title> <style> *{ margin: 0; padding: 0; } .box{ width: 300px; height: 360px; margin: 50px auto; bo

2021-02-06 15:14:45 98

原创 jQuery基础03

事件绑定与解绑事件绑定的两种方式<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>事件绑定</title> <script src="../lib/jquery.js"></script> <script> $(function(){ /* jQuery中有两种绑定事件的方式

2021-02-06 15:13:44 328

原创 jQuery基础02

部分内容选择器<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>内容选择器</title> <style> div{ width: 50px; height: 100px; background-color: red; margin-top: 5px; } </style> &

2021-02-06 15:13:00 113

原创 jQuery基础01

什么是jQueryjQuery是一款JavaScript的库，作用是能让我们对HTML文档遍历和操作、事件处理、动画以及Ajax变得更简单。jQuery的使用<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>HelloWorld</title>  <script src="../lib/jqu

2021-02-06 15:12:04 126

原创 JavaScript笔记06

BOM编程open和close<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>BOM编程-open和close</title> </head> <body> <script type="text/javascript"> /* 1.BOM编程中，window对象是顶级对象，代表浏览器窗口

2021-01-10 15:04:34 219

原创 JavaScript笔记05

表单验证<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>表单验证</title> <style type="text/css"> span{ color: red; font-size: 12px; } </style> </head> <body> <sc

2021-01-10 15:03:56 83

原创 JavaScript笔记04

设置和获取文本框的value<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>DOM编程-获取文本框的value</title> </head> <body> <script type="text/javascript"> /* 1.javaScript包括三大块 ECMAScript：

2021-01-10 15:03:14 87 1

原创 Javascript笔记03

常用事件、回调函数与注册事件的两种方式<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>js的常用事件</title> </head> <body> <script type="text/javascript"> /* JS中的事件： blur失去焦点 focus获得焦点

2021-01-10 15:02:25 139

原创 Javascript笔记02

js的数据类型<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>数据类型</title> </head> <body> <script type="text/javascript"> /* 虽然js的变量在声明的时候不需要指定数据类型，但是在赋值的时候，每一个数据还是有类型的，所以这里需要学

2021-01-10 15:01:35 78

原创 JavaScript笔记01

概述JavaScript是运行在浏览器上的脚本语言，简称JS。在HTML嵌入JavaScript的三种方式第一种方式<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>第一种方式</title> </head> <body> <!-- 1.要实现的功能：用户点击按钮，弹出消息框 2.JS是一门

2021-01-10 15:00:08 174 1

原创 CSS笔记

概述什么是CSS，有什么用？CSS（Cascading Style Sheet）：层叠样式表语言CSS的作用：修饰HTML页面，设置HTML页面中的某些元素的样式，让HTML页面更好看。HTML引入CSS的三种方式第一种方式在标签内部使用style属性来设置元素的CSS样式，这种方式称为内联定义方式语法格式：<标签 style = "样式名:样式值; 样式名:样式值; 样式名:样式值; ..."></标签><!DOCTYPE html><htm

2020-12-18 17:18:10 64 1

原创 HTML笔记（二）

表单<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>表单form</title> </head> <body> <!-- 1.表单有什么用？收集用户信息。表单展现之后，用户填写表单，点击提交按钮提交数据给服务器 2.如何画表单使用form标签画表单 3.一个网页当中可以有多个表单

2020-12-18 17:17:17 425 2

原创 HTML笔记（一）

概述HTML：Hyper Text Markup Language（超文本标记语言）由大量的标签组成，每一个标签都有开始和结束标签<标签> <标签> <标签属性名 = '属性值' 属性名 = '属性值'></标签> </标签></标签>超文本：流媒体、图片、声音、视频…HTML开发的时候使用普通的文本编辑器就行，创建的文件扩展名是.html或者.htmHTML也有专业的开发工具，例如：

2020-12-18 17:16:35 267 1

原创 JDBC笔记（二）

JDBC实现模拟用户登录功能package com.jdbc;import java.sql.*;import java.util.HashMap;import java.util.Map;import java.util.Scanner;/*实现功能： 1.需求：模拟用户登录功能的实现 2.业务描述：程序运行的时候，提供一个输入的入口，可以让用户输入用户名和密码用户输入用户名和密码之后，提交信息，Java程序收集到用户的信息

2020-12-18 17:14:59 81 1

原创 JDBC笔记（一）

JDBC是什么？Java DataBase Connectivity（java语言连接数据库）本质：JDBC是sun公司制定的一套接口（interface），java.sql.*;（这个软件包下有很多接口）JDBC编程六步（背会）注册驱动告诉java程序，即将要连接的是哪个品牌的数据库获取连接表示JVM的进程和数据库进程之间的通道打开了，这属于进程之间的通信，重量级的，使用完之后一定要关闭通道获取数据库操作对象（专门执行SQL语句的对象）执行SQL语句处理查询结果集

2020-12-18 17:13:55 122 1

空空如也

空空如也