五月天差一天-CSDN博客

原创前端小测试总结

前言好久没有更新了，最近做了一个黑马的前端测试题，也算是一个阶段测试，题虽不难，但是遇到的问题一大堆，侧面反应了自己基础知识学的还是不够扎实，需要再接再厉，查漏补缺，在这里记录一下遇到的问题和解决的方法。一、测试简介测试主要是实现两个页面之间的切换，实现tab栏的切换，同时从后端服务器拿数据通过模板渲染到项目要求按照效果图进行网页布局分析；根据网页布局分析+设计图进行HTML+CSS布局；使用Express搭建静态服务器；启动后端服务，提供前端所需数据接口；使用jQuery实现Tab栏功

2021-06-06 20:42:11 293

原创前端——搞懂jQuery中的text()、val()和html()

前言今天在学表单验证的时候突然被text()、val()和html()搞混了，于是为了彻底记住就写篇博客来加深印象吧！text()、val()和html()为了便于理解，通过代码来说明。在html文件中定义一个div盒子，在盒子里放上span和input元素。<div> div里面的文字 <span>span里面的文字</span> <input type="text" name="" value="input的value值"> <in

2021-04-18 20:23:18 578

原创前端——给button制作一个简单的爱心特效(2)

前言昨天做的爱心特效其实没有达到我的期望，如下图，爱心都是在停止之后才开始消失，而我想实现爱心在移动过程中逐渐消失。今天在通过阅读大佬们的博文后，受到点启发，就来重新实现一下。实现过程昨天我采用的是animate()结合fadeOut()来实现的特效，看了大佬们的博文后，了解到可以用透明度加remove()来实现（怎么简单我昨天怎么就没想到呢????），如下面的代码。$love.eq(1).animate({'left':$btnposi.left-36,'top':$btnposi.top-15

2021-04-16 13:44:06 1539

原创前端——给button制作一个简单的爱心特效(1)

##前端——给button制作一个简单的特效前言今天在学习bootstrap的时候栅格系统的时候，突然心生一个小点子，就是能不能对搜索框加点料，让其变的生动起来，大概是下面的样子。心动不如行动，活学活用、现学现卖，加深理解，开始敲键盘。首先要做个搜索框出来，用bootstrap来做很容易，bootstrap是一个基于html 、css和js所开发出来的前端框架，它使得网页的开发更高效，同时也更具有观赏性，所以学了一点皮毛的我就迫不及待赶紧来试一试了。一、制作搜索框首先找到bootstrap中文的

2021-04-16 00:35:16 1564 3

原创前端——鼠标监听事件

前端——部分鼠标监听事件下午跟着视频做一个拖拽案例的时候，想实现一个简单想法，如下面视频所示。就是在拖拽的时候，右边的数字变成红色，不拖拽时又变回原来的颜色。有想法就马上执行，我第一反应当然是用鼠标监听事件来做，但是在mouseover()和mouseout()、mouseenter()和mouseleave()或者hover()中应该选择哪个来做呢，尴尬的是好像都不行，因为拖拽有一个特点，只要第一次点住目标不放，后面鼠标不在目标上也能拖拽目标，这就导致拖拽过程中鼠标一旦偏出目标，数字就会变回原色。那

2021-04-14 21:09:29 1823

原创前端——解决用户暴力操作出现的问题

前端——解决用户暴力操作出现的问题用户在控制或点击界面切换时，如果点击过快会出现图像视觉混乱的现象，通过今天的学习了解了两种方法可以解决这种情况。添加stop()函数通过在animate()函数前添加stop()函数来解决暴力操作的问题。stop()函数默认是控制动画在短时间内多次激活时，只完整保留最后一次动画，前面所有的动画都立刻停止。$(function(){ $('#btn').click(function(){ $('.box').stop().animate({'width':'

2021-04-14 14:29:51 237

原创前端——函数防抖

前端——函数节流晚上在视频学习过程中遇到一个比较高效的方法——函数节流，就是通过定时器的方法来解决在web开发中如resize事件，mousemove事件和鼠标滚轮事件(jquery.mousewheel)等事件触发频率高的问题，下面主要以鼠标滚轮事件来讲解。$(window).mousewheel(function(event,dat){ clearTimeout(timer); //函数节流的关键 timer = setTimeout(function(){ if (dat==-1) {

2021-04-13 22:57:08 273

原创前端——事件委托

前端——事件委托在今天的事件委托实际应用案例的学习当中，遇到了一些小问题，在这里分享一下。Todolist案例-不用事件委托来做根据教学视频首先不用事件委托的思想来完成Todolist,下面是js部分的全代码。$(function(){ var $txt1 = $('#txt1'); var $btn1 = $('#btn1'); var $list = $('#list'); $btn1.click(function(){ if ($txt1.val()=="") { al

2021-04-13 17:44:32 227

原创前端——事件冒泡

前言分享一些平时前端学习中遇到的比较重要的函数，同时加强自身的记忆事件冒泡事件冒泡是指触发子级的某类事件，像onclick()事件等，所有父级对象的所有同类事件都会被触发直到达到最顶层document或者window。事件冒泡可以让多个操作被集中处理，也可以在对象层的不同级别捕获事件。下面介绍一个利用事件冒泡原理的事件——事件委托。$(function(){ //这里的click()代码虽然只有一句，但其实是把.list中的li都绑定一遍，对性能不利。 $('.list li').click(f

2021-04-12 10:34:57 1164

s707365172的博客