咕叽小丹-优快云博客

原创 Demo3：原生JS实现购物车（简易版）

代码效果代码（1）HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2021-08-03 01:14:54 243

原创 Demo2：原生JS导航栏Tab切换

代码效果（具体效果可根据自己的需求进行增加）代码（1）CSS /* CSS文件 */ * { margin: 0; padding: 0; } html,body { width: 100%; min-width: 1000px; height: 100%; } .tab-nav,.tab-nav ul{ width: 100%; height: 40px; font-size: 0; box-shadow:3px 3px

2021-07-30 01:22:25 197

原创 Demo1：原生JS实现按钮加减操作（简易版）

代码效果代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <tit

2021-07-29 23:36:44 1947

原创 DOM事件+正则表达式

一、DOM事件事件是文档或浏览器窗口发生的，特定的交互瞬间，JS与HTML之间的交互通过事件来实现的例如：瀑布流轮播图 1、事件流事件流——描述的是从页面中接受事件的顺序 IE公司——事件冒泡流 Netscape公司——事件捕获流 1.1 事件冒泡事件最开始由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播至不具体的那个节点 <div id="box"> <input type="button" value=

2021-07-19 20:50:41 312

原创 CSS(part 1)

CSS(part 1) 一、引入 1.什么是CSS CSS 指层叠样式表 (Cascading Style Sheets) 通过CSS样式来定义如何显示 HTML 元素，（字体、段落等等）样式通常保存在外部的 .css 文件中 2.CSS语法 CSS 规则由两个主要的部分构成：① 选择器；② 一条或多条声明为了代码查看，一般对样式进行注释，CSS注释以 /* 开始, 以 */ 结束,注释会被浏览器忽略，vscode注释快捷键 Ctrl + / ，也可以自定义快捷键 /* CSS声明总是以分

2021-04-27 22:47:23 514 2

原创学习笔记④ (AJAX)

1 . AJAX的简介全称： Asynchronous Javascript And XML 异步JavaScript 和XML 浏览器向服务器发送异步请求最大优势：无刷新获取数据不是一门汇编语言 2 . XML简介可扩展标记语言被设计用来传输和存储数据 xml和html类似，不同的是html都是预定义标签，而xml中没有预定义标签，全都是自定义标签，用来表示一些数据现在被JSON取代 3.AJAX的特点 3.1 AJAX的优点（1）无需页面刷新而与服务端通信（2）允许

2020-09-16 20:16:24 117

原创学习笔记③ (jQuery 动画效果)

jQuery 动画效果 1.显示隐藏效果 1.1显示 (1) 显示语法规范 show( [ speed,[easing],[fn] ] ) (2) 显示参数参数都可以省略，无动画直接显示 speed（速度） : ①“show” | “normal” | “fast” ; ②表示动画时长的毫秒数值（如：100） easing （切换效果）：“swing”(默认:慢快慢) | “linear”（匀速） fn （回调函数）：在动画完成时执行的函数。每个元素执行一次 1.2 隐藏 (1) 显示语法

2020-09-16 20:13:00 171

原创学习笔记② （jQuery的应用）

jQuery 样式操作 1. 操作css方法 jQuery 可以使用css方法来修改简单元素样式，；也可以操作类，修改多个样式 //css以及html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> &l

2020-09-16 20:11:49 105

原创学习笔记①（jQuery概述与使用）

jQuery 1、概述 1.1 常见JS库 jQuery Prototype YUI DOjo Ext JS 移动端的zepto 2、使用 2.1 JS入口函数等着页面DOM加载完毕再去执行js代码相当于原生JS中的DOMContentLoaded 不同于原生JS中的load 2.1.1 <div></div> <script> $(document).ready(function(){ $('div').hide()

2020-09-16 20:10:34 109

m0_46577056的博客