老徐WEB前端开发_公众号
分享WEB前端开发知识,总结WEB开发经验,线上案例解析,WEB前端开发技术交流,共同进步。
老徐WEB
为人诚信开朗,勤奋务实,具有很强的领导组织能力和团队精神 ,专业理论知识丰富,基础扎实,善于思考,自学能力强 ,
创新和实践能力强, 热爱集体,能以大局为重,具有奉献精神。
QQ/VX:398911281
展开
-
老徐WEB:js入门学习 - javascript工作中常用到的日期问题
工作中常用到的日期问题大致有两个日期间隔天数、某个日期前后几天的日期、日期格式化和日期时间戳等。javascript没有直接的函数来处理这些问题,老徐根据之前工作经验,把这些问题的解决方法总结一下,希望对大家有用。计算两个日期间隔天数,包括当天和某一天,参数是日期字符串。function intvalDays(date1,date2){ var days = 0; var d1 = Date.parse(date1); var d2 = Date.parse(date2); cons原创 2020-06-26 11:32:41 · 277 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript对象之Date对象
Date对象用于处理日期与时间。通过new关键字创建Date对象实例,有四种方法。var d = new Date() // 当前日期和时间var d = new Date(milliseconds) //返回从 1970 年 1 月 1 日至今的毫秒数var d = new Date(dateString)var d = new Date(year, month, day, hours, minutes, seconds, milliseconds)Date对象的属性construc原创 2020-06-09 11:26:06 · 393 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript对象之Array对象
数组对象的作用就是使用一个变量存储一系列值。假如你有一些数据,分别是语文课本、数学课本、英语课本等,如果你要为每个课本分配一个变量,就得需要三个变量。如果你的数据很多,可能需要大量的变量,此时就可以考虑使用数组来存储这些数据。声明数组有三种方式1.用new创建数组对象var cars = new Array();cars[0] = 'BYD';cars[1] = 'geely';cars[2] = 'roewe';2.简洁方式var cars = new Array(.原创 2020-06-04 23:11:27 · 384 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript对象之Number对象
Number 对象var num = new Number(value);注意: 如果一个参数值不能转换为一个数字将返回 NaN (非数字值)。new Number('abc'); // Number{NaN}Number 对象属性constructor - 返回对创建此对象的 Number 函数的引用。NaN - 非数字值。prototype - 允许您可以向对象添加属性和方法。Number 对象方法isFinite() - 检测指定参数是否为无穷大。Number.原创 2020-06-01 21:46:08 · 237 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript函数和闭包
函数是一段可以重复执行的代码块。比如我们经常会做这样的事,通过标签ID获取元素对象,javascript语句是document.getElementById('demo')。我们就可以把这一句写成一个函数,传递的参数就是标签ID的值,然后返回元素对象。把重复做的事情,写成一个函数,下次再碰到同样的事情,直接调用函数即可,不用再重复写一堆同样的代码的。函数内的代码功能不要太复杂,如果复杂了,就可以把代码块分成多个函数,尽量让一个函数只做一个事情。下面介绍函数的声明、参数、调用。函数声明ja原创 2020-05-18 10:05:06 · 234 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript语句
javascript语句是给浏览器发送命令的,告诉浏览器要做什么事情。javascript是脚本编程语言,浏览器在读取代码时,会自上而下逐行执行代码。javascript用分号来分隔语句,每条语句的结尾添加分号,表示一条语句的结束。一行代码可以写一条语句,也可以写多条语句,根据具体环境来定,同时必须考虑代码可读性。下面老徐介绍几种javascript常用的语句。条件语句(三种形式)if语句 - 满足条件时执行代码。if(condition){// 执行代码}if(工作日){.原创 2020-05-09 11:37:26 · 211 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript运算符
javascript的运算符有算术运算符、赋值运算符、连接运算符、比较运算符、逻辑运算符和条件运算符。运算符就是变量与变量之间的运算关系。有的是两个变量间的加减乘除关系,有的是把字符串赋值给一个变量,有的是大小比较关系,有的是真假关系等。下面老徐一一给大家介绍。算术运算符算术运算符包括加(+)、减(-)、乘(*)、除(/)、取模/取余(%)、自增(++)和自减(--)。上面这几个运算都很简单的,举几个例子就能明白了。var x = 8, y = 2; // 先声明两个变量,留着备.原创 2020-05-08 22:56:08 · 224 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript数据类型转换
javascript有多种数据类型,如字符串、数字、布尔等,可以通过typeof语句来查看变量的数据类型。数据类型转换就是数据类型之间相互转换,比如把数字转成字符串、把布尔值转成字符串、把字符串转成数字等,这在工作也是经常碰到的。在操作数据之前先把数据类型确认一下(不是必须的),然后再进行处理。比如你获取了一个数字5,其实它是字符串类型,只是看着像数字5,然后跟一个数字2进行加法运算。你希望得...原创 2020-05-07 19:02:22 · 410 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript变量的数据类型
计算机可以处理的数据类型有多种,分为基本类型和引用类型。基本类型有字符串、数字、布尔、空、未定义和Symbol,引用类型有对象、数组和函数,下面老徐一一介绍。注:Symbol是ES6引入了一种新的原始数据类型,表示独一无二的值。字符串类型字符串类型是指用引号包含起来的任意文本,引号可以是单引号,也可以是双引号。如果文本里包含有单引号,那么就用双引号包括起来,如果文本里有双引号,那么就是...原创 2020-05-05 17:46:48 · 318 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript变量命名方法和关键字
在javascript的编程过程中,变量是不可少的、常被用到的重要知识。那么变量的命名也就显得很重要了。刚开始学习编程的同学有这么一种感觉,变量其实就是一个符号,怎么写都行,就算变量名为a、b、c等都行,反正我是知道它们代表什么意思。这是刚开始学习编程的同学的一些想法,因为老徐也有过这样的想法。为什么会有这样的想法,因为刚开始学习时,代码片段都比较短,基本不会超过20行,所以就算把变量命名成a,你...原创 2020-05-03 19:56:08 · 342 阅读 · 0 评论 -
老徐WEB:js入门学习 - javascript变量
javascript变量是最基础的知识,也是学习任何编程语言都会接触,并且要学习的知识。如果你在编程过程中需要存放一个数字,比如100,那么你首先要声明一个变量,然后把数字100赋值给变量,这样在程序中就有了100这个数字了,程序后面相关的计算操作都会通过这个变量来完成。再比如,你想存放一个hello的字符串,也是要声明一个变量,然后把hello赋值给变量。或者从后台数据库获取的数据,也是要存...原创 2020-04-28 16:08:19 · 237 阅读 · 0 评论 -
老徐WEB:js入门学习 - 认识javascript
前端开发者或者想要学习前端开发的朋友,应该都知道前端开发就是学习HTML,CSS和javascript。这是前端开发必不可少三种技能,HTML是结构层,搭建框架;CSS是表现层,做装饰的;javascript是行为层,做动态交互。可能有人要问还是Jquery,vue等,这些都是javascript的框架,只要学好javascript,这些框架也会好学的。接下来简单介绍一下javascript。...原创 2020-04-24 21:13:48 · 319 阅读 · 0 评论 -
老徐WEB:学好这几个HTML标签就够用了(一)
先说一下老徐刚开始学习HTML基础的情景,打开w3school网站,找到HTML基础教程,兴致勃勃的准备从上到下一个一个的内容开始看起来,一个字一个字的看,十分投入,每看完一节内容就觉得有很大的收获了,信心满满。看到第5节内容的时候,有点疲惫了,注意力不集中了,开始走神了。此时我意识到不能光看内容,还是动起手来写一写,练一练,可以加深印象,至少不会走神了。然后在网站的示例里开始添加一点...原创 2020-02-16 19:17:20 · 460 阅读 · 0 评论 -
老徐WEB:swiper插件实现图片滚动轮播图(三)
老徐看到网上有用swiper来实现轮播图的,就研究了下。发现swiper挺简单的,事例介绍清晰,文档容易理解,就试着做了一个网站常用的轮播图。swiper官网提供了很多事例,有简单实用的,也有很炫的,根据自己的需要选择相应的样式。如果对轮播图原理和制作过程不熟悉的,可以看看老徐之前的相关轮播图的两篇文章,【最简单详细的轮播图原理和制作过程】和【JS简单实现图片滚动效果轮播图,自动和手动】。...原创 2020-02-27 17:19:36 · 725 阅读 · 0 评论 -
老徐WEB:JS简单实现图片滚动效果轮播图,自动、手动和自适应(二)
轮播图是前端网页中常用的功能,包括PC端和移动端,都会用到轮播图,像咨讯、电商和个人博客等,首页基本都会有轮播图。老徐在上一篇文章的基础上【最简单详细的轮播图原理和制作过程】,又扩展了功能,使之成为网站中常用的样子,包括右下角提示钮和左右滚动按钮。如果还不清楚轮播图原理,请先看上一篇文章,先理解了原理,再看这篇文章,效果会更好。这是一个完整的常用的轮播图,可以说拿去直接用就好,最终效果图如...原创 2020-02-23 23:34:41 · 3463 阅读 · 17 评论 -
老徐WEB:最简单详细的轮播图原理和制作过程(一)
老徐利用空闲时间,制作了一个最简单的轮播图,主要介绍轮播图的原理和制作过程,只要大家能认真看完这篇文章,并理解文中内容,就能完全掌握轮播图的制作了。之后工作中碰到复杂的轮播图,自己也能思考制作出来了。对于这篇文章,老徐的建议是先认真看一遍内容,不着急写代码。边看边理解边消化,等你真正理解整个制作过程,代码只是顺手的事。对于部分前端开发者来说,JS算有些难度,这个轮播图里的JS不多,难度不大,...原创 2020-02-20 14:38:23 · 4245 阅读 · 3 评论 -
老徐WEB:有哪些常用的CSS块级元素和行内元素
老徐WEB:有哪些常用的CSS块级元素和行内元素块级元素:一般是其他元素的容器,可容纳内联元素和块级元素,块级元素独占一行,可以设置元素宽度、高度。常见的有div,p。address,div,dl,dt,dd,fieldset,form,h1~h6,hr,menu,ol,p,pre,table,ul。内联元素:内联元素只能容纳文本或其他内联元素,多个内联元素可以排放在一行,但元素宽度、高...原创 2020-02-08 21:45:25 · 293 阅读 · 0 评论 -
老徐WEB:CSS伪类和伪元素详解
比较常见的伪类有:link、:visited、:hover等,伪元素有:before、:after等,前端开发者多多少少都有接触过,又或者用过但不知道是伪类伪元素的情况。合理正确的利用伪类、伪元素有利于减少对DOM的操作。伪类是基于当前HTML标签(元素)的操作,即作用于整个元素的操作,这是相对伪元素来说的,也是我自己方便记忆的理解。伪类又分为状态伪类和结构性伪类。状态伪类是基于当前HTML标签(...原创 2020-02-02 09:47:43 · 578 阅读 · 0 评论 -
老徐WEB:CSS块级元素和行内元素的区别
CSS包含块级元素、行内元素和行内块元素。HTML页面是由元素,也叫标签构成的。每个元素在HTML页面中生成一个包含内容的框,就是大家知道的”盒子“。不同的元素显示的方式不同,有的独自占据整个一行,除非使用float属性,否则其他元素不能与其共一行,这就是块级元素,比如div,h(1,2,3,4,5,6),p元素等。有的元素水平挨着连续排放,直到一行放不下了,才换行,这就是行内元素,比如span,...原创 2020-01-31 19:12:07 · 409 阅读 · 0 评论 -
老徐WEB:深入学习CSS选择器
什么是CSS选择器,什么时候需要CSS选择器,这是网页制作及开端开发者们经常碰到的问题。在网页制作过程中,HTML用来制作网页框架,然后就需要给网页添加样式,类似房屋装修一样,装饰整个页面,此时就得需要用到CSS选择器了。CSS选择器就是对HTML页面中的元素进行控制操作的表示方法。也就是HTML页面中的元素是通过CSS选择器控制的。CSS选择器的基本用法是:CSS选择器{CSS属性...原创 2020-01-31 15:43:10 · 197 阅读 · 0 评论