- 博客(22)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 JavaScript案例合集（一）
循环精灵图和显示隐藏文本框内容利用for循环设置一组元素的精灵图背景正在上传…重新上传取消找到精灵图图片排列的规律 核心思路：利用for循环，修改精灵图片的背景位置background-position<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="I.
2022-05-17 21:36:52
356
原创 API和Web Api
APIAPI（应用程序编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。简单理解：API是给程序员提供的一种工具，以便能更轻松的实现想要的功能。Web APIWeb API是浏览器提供的一套操作浏览器功能和页面元素的API（BOM和DOM）。现阶段我们主要针对于浏览器讲解常用的API，主要针对浏览器做交互效果。比如我们想要浏览器弹出一个警示框，直接使用alert（'弹出'）MDN详细AP
2022-05-04 21:35:29
432
原创 一款拥有漂亮外表的Typecho简洁主题-Scarfskin
前言纠结了好久，最终我还是决定将这款主题免费开源。一个原因是她并不能满足我自己心里想要的主题，所以就当拿来练手了。另一个原因是这款主题我过于借鉴Mirages主题，出于对作者的尊重，我甚至考虑好久是否要将她发布出来，但我又认为这款主题与Mirages主题比较相差甚远，所以我决定将她免费发布。介绍scarfskin译为外皮，如你所见，这是一款拥有漂亮外表的主题，没有繁杂的侧栏，更没有不知所措的功能，就是直接又漂亮的外表和纯粹的文章。她真的很适合一个对于多样性功能要求并不高而却...
2022-04-18 10:18:39
1979
原创 JS实现导航栏下滑悬浮透明置顶
如果仅仅想把导航栏固定，添加以下属性即可：style="position: sticky;"注：前提是你已经写好了导航栏。如果想将导航栏下滑悬浮透明，请参照如下方式：给header盒子(整个导航的盒子)添加id="headerTop"并添加以下css样式：#headerTop{ /*使导航栏固定在顶部*/ position: fixed; top:0; left: 0px; z-index: 1000; /*一开始就不给导航..
2022-04-17 00:00:59
1385
原创 CSS实现背景图毛玻璃效果和如何保持图片上的文字显示正常
说明因为我的底子特别的差(大佬勿喷)，今天想让文字在图片上方显示，并且给图片模糊，结果当图片模糊之后也就是实现毛玻璃效果后，发现图片上的文字也模糊掉了，这个问题当然可以用伪元素的方式解决，但是由于某些原因，这里不能使用伪元素。然后我找到了filter（滤镜)属性，他主要是运用在图片上，以实现一些特效。然后用滤镜属性进行模糊后，发现他的效果是下图这样的：此时文字正常显示了，图片也模糊，但是我又遇到一个问题，就是如果图片是白色的，即使模糊掉，文字显示的效果也很差，比如下图这样...
2022-04-14 12:45:44
1663
原创 JavaScript——字符串对象
基本包装类型为了方便操作基本数据类型，JavaScript还提供了三个特殊的引用类型：Srting、Number和Boolean基本包装类型就是把简单数据类型包装成为了复杂数据类型，这样基本数据类型就有了属性和方法。以下代码的问题：按道理基本数据类型没有属性和方法，而对象才有属性和方法，但上面代码却可以执行，这是因为js会把基本数据类型包装为复杂数据类型。 var str = 'zeyi'; console.log(str.length); //4其执行过程如下:.
2022-04-11 18:32:52
771
原创 JavaScript——数组对象
创建数组利用数组字面量 var arr = [1, 2, 3]; console.log(arr[0]);利用new Array() //var arr1 = new Array(); //创建了一个空数组 //var arr1 = new Array(2); //这个2表示数组长度为2，里面有2个空的数组元素 var arr1 = new Array(2, 3); //等价于[2,3] 表示里面有2个数组元素是2和3 console.log(
2022-04-10 16:15:26
160
原创 JavaScript——日期对象
日期对象Date()日期对象是一个构造函数，必须使用new来调用创建我们的日期对象。使用Date var date = new Date(); console.log(date);参数常用写法：数字型：2022,10,09 var date1 = new Date(2022, 04, 09); console.log(date1);//返回值大一月字符串型：'2022-10-09 8:8:8' (常用写法) var date2 = ne
2022-04-09 22:35:42
381
原创 JavaScript案例：倒计时
案例分析核心算法：输入的时间减去现在的时间就是剩余时间，即倒计时，但是不能拿时分秒去减，比如05分减去25分，结果是负数。 用时间戳来实现，用户输入时间总的毫秒数减去现在时间的总的毫秒数，得到的就是剩余时间的毫秒数。 把剩余时间的毫秒数转换为时分秒标准格式。转换公式d = parselnt(总秒数/60/60/24);//计算天数h = parselnt(总秒数/60/60%24); //计算小时m = parselnt(总秒数/60%60); //计算分数s = parselnt(总
2022-04-09 22:32:58
789
原创 JavaScript——Math对象
Math对象Math数学对象，不是一个构造函数，所以我们不需要new来调用，而是直接使用里面的属性和方法即可，跟数学相关的运算（求绝对值，取整、最大值等）可以使用Math中的成员。 console.log(Math.PI); //一个属性，圆周率 console.log(Math.max(1, 98, 26)); //输出最大值98 console.log(Math.max(1, 98, '岳泽以')); //NaN 如果有任一参数不能被转换为数值，则结果为 NaN。
2022-04-09 22:31:39
643
原创 JavaScript——内置对象
内置对象JavaScript中的对象分为3种：自定义对象、内置对象、浏览器对象前面两种对象是JS基础内存，属于ECMAScript，第三种浏览器对象属于我们JS独有的。内置对象就是指JS语言自带的一些对象，这些对象供开发者使用，并提供了一些常用的或是最基本而必要的功能（属性和方法）。内置对象最大的优点就是帮助我们快速开发JavaScript提供了多个内置对象：Math、Date、Array、String等查询MDN文档学习一个内置对象的使用，只要学会其常用成员的使用即可。我们
2022-04-09 22:30:54
256
原创 Javascript案例：猜数字游戏
要求程序随机生成一个1~10之间的数字，并让用户输入一个数字。如果大于该数字，就提示，数字大了，继续猜 如果小于该数字，就提示，数字小了，继续猜 如果等于该数字，就提示猜对了，结束程序。思路随机生成一个1~10的整数，我们需要用到Math.random()方法。 需要一直猜到正确为止，所以需要一直循环。 while循环更简单 核心算法：使用if else if多分支语句来判断大于、小于、等于。代码 function getRandom(min, max) { ..
2022-04-09 21:07:00
6687
原创 JavaScript——对象
对象在现实生活中，万物皆对象，对象是一个具体的事物，看得见摸得着的实物。例如：一本书、一辆汽车、一个人都可以是“对象”，而一个数据库、一个网页、一个与远程服务器的连接也可以是“对象”。在JavaScript中，对象是一组无序的相关属性和方法的集合，所有的事物都是对象，例如字符串、数值、数组、函数等。对象是由属性和方法组成的属性：事物的特征，在对象中用属性来表示（常用名词） 方法：事物的行为，在对象中用方法来表示（常用动词）为什么需要对象？保存一个值时，可以使用变量，保存.
2022-04-06 18:40:32
467
原创 轻量级Typecho极简主题——Ltns【好久不见】
Hello，好久不见！拖了两天，用了大约五六个小时时间，我完成了第一个Typecho主题。有这个主题的想法，源于看见Typecho在长达近五年的断更时间下，Typecho更新了1.2.0版本。对这次更新，无非是变了个版本号，由一长串的1.1/17.10.30变成了简单的1.2.0。但是细想自己在购买主题这件事情上面交了很多智商税，而且现在懒于修改主题，即使看着不舒服也不想折腾，距自己18年时候二开的Ssanl（启程新生活）主题也已经有四年时间了，闲着也是闲着，就看了看ty...
2022-04-06 17:41:04
5556
原创 利用JS将a标签超链接到一个随机数字地址
这两天在制作Weblog网站的时候，想添加一个点击链接随机跳转到一个认证页面，因为认证页面的后缀都是数字.html，所以其实很简单，这个功能也类似十年之约的虫洞，但是我觉得其用的不是这种方式。JS部分首先需要创建JS来随机获取一个数字，并合成链接地址：<script>//合成链接地址function myFunction(e) { var number = randomNum(1, 100); e.href = "https://weblog.net.cn/au
2022-04-01 16:43:20
1109
原创 JavaScript——函数
函数的概念在JS里面，可能会定义非常多的相同代码或者功能相似的代码，这些代码可能需要大量重复使用。虽然for循环语句也能实现一些简单的重复操作，但是比较具有局限性，此时我们就可以使用JS中的函数。函数：就是封装了一段可以被重复调用执行的代码块，通过此代码可以实现大量代码的重复使用。函数的使用1.声明函数 function 函数名() { //函数体 }function是声明函数的关键字，全部小写 函数是做某件事情，函数名一般是动词 函数不调用自己不执行
2022-04-01 16:38:19
109
原创 JavaScript——数组
数组数组(Array)是指一组数据的集合，其中的每个数据被称作元素，在数组中可以存放任意类型的元素。数组是一种将一组数据存储在单个变量名下的优雅方式。 //普通变量一次只能存储一个值 var num = 10; //数组一次可以存储多个值 var arr = [1, 2, 3, 4, 5];创建数组JS中创建数组有俩种方式：利用new创建数组 利用数组字面量创建数组利用new创建数组： var 数组名 = new Array();
2022-04-01 16:37:36
370
原创 JavaScript——流程控制
流程控制在一个程序执行的过程中，各条代码的执行顺序对程序的结构是有直接影响的，很多时候我们要通过控制代码的执行顺序来实现我们要完成的功能。流程控制就是来控制我们的代码按照什么结构顺序来执行。流程控制主要有三种结构：顺序结构、分支结构和循环结构，这三种结构代表三种代码执行的顺序。顺序结构顺序结构是程序中最简单、最基本的流程控制，它没有特定的语法结构，程序回按照代码的先后顺序，依次执行，程序中大多数的代码都是这样执行的。分支结构由上到下执行代码的过程中，根据不同的条件，执行.
2022-04-01 16:36:39
803
原创 JavaScript——运算符
运算符（operator）也被称为操作符，是用于实现赋值、比较和执行算数运算等功能的符号。JavaScript中常用的运算符有：算术运算符 递增和递减运算符 比较运算符 逻辑运算符 赋值运算符算术运算符概念：算术运算使用的符号，用于执行俩个变量或值的算术运算。运算符 描述 实例 + 加 10+20=30 - 减 20-10=10 * 乘 10*20=200 / 除 10/20=0.5 % 取余数(
2022-04-01 14:50:03
481
原创 JavaScript——数据类型
简介在计算机中，不同的数据所需占用的存储空间是不同的，为了便于把数据分成所需内存大小不同的数据，充分利用存储空间，于是定义了不同的数据类型。简单来说，数据类型就是数据的类别符号。比如姓名”张三“，年龄18，这些的数据类型是不一样的。变量的数据类型Javascript是一种弱类型或者说动态语言。这意味着不用提前声明变量的类型，在程序运行过程中，类型会被自动确定。var age = 10; //这是一个数字型var areYouOK = '是的' //这是一个字符串js的变量数据
2022-04-01 14:49:01
635
原创 JavaScript——变量
变量变量就是一个装东西的盒子。变量是用于存放数据的容器，我们通过变量名获取数据，甚至数据可以修改。本质：变量是程序在内存中申请的一块用来存放数据的空间。类似我们酒店的房间，一个房间就可以看做是一个变量。变量的使用声明变量// 声明变量var age;//声明一个名称为age的变量var是一个JS关键字，用来声明变量（variable变量的意思）。使用该关键字声明变量后，计算机会自动为变量分配内存空间，不需要程序员管。age是程序员定义的变量名，我们要通过变量名来访..
2022-04-01 14:46:53
1412
原创 JavaScript——入门知识
计算机组成计算机程序运行：打开某个程序时，先从硬盘中把程序的代码加载到内存中。 CPU执行内存中的代码。注意：之所以要内存的一个重要原因，是因为cpu运行太快了，如果只从硬盘中读取数据，会浪费cpu性能，所以才使用存取速度更快的内存来保存运行时的数据。（内存是电，硬盘是机械）JavaScriptJavaScript是世界上最流行的语言之一，是一种运行在客户端的脚本语言。脚本语言：不需要编译，运行过程中由js解释器（js引擎）逐行来进行解释并执行。现在...
2022-04-01 14:45:01
405
PHP制作的私密留言板源码
2022-05-17
Typecho 简洁单栏封面图式主题 Scarfskin-V1.0.2
2022-05-17
PHP+Mysql设计的学生信息管理系统
2022-05-17
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人