前端
_i_look_
默默无闻的前端开发从业者
展开
-
span文本自动换行
word-break: break-all; width: auto; display: block; white-space: pre-wrap;原创 2021-02-19 14:05:06 · 699 阅读 · 0 评论 -
nodejs使用express创建静态文件服务器
nodejs使用express创建静态文件服务器const express = require('express')const app = express()app.use(express.static('/home/hws'))app.listen(8080, () => console.log('Example app listening on port 8080!'))原创 2020-10-13 16:46:24 · 628 阅读 · 0 评论 -
React监听键盘事件
import React, { Component } from "react";import { withRouter } from 'react-router-dom'import "./index.scss";class Header extends Component { constructor(props) { super(props); this.state = { inputValue: "", }; } onChange=(e)=&g原创 2020-09-08 10:58:19 · 1486 阅读 · 0 评论 -
placeholder文字换行
<TextArea rows={4} placeholder={"请填写部分路径或完整路径,例如:" + String.fromCharCode(10) + "/www/website/upload/\n/upload/" + String.fromCharCode(10) + ".zip"} />String.fromCharCode(10) 换行符原创 2020-07-01 15:10:03 · 1091 阅读 · 0 评论 -
防止浏览器默认填充输入框
<input name="username" type="text" readonly οnfοcus="this.removeAttribute('readonly');"/>原创 2020-05-25 14:35:35 · 435 阅读 · 0 评论 -
css实现水波浪效果
在项目中,我们常常想用css做成更美的效果,水波浪图就是最常用的方法。那么我们怎么实现呢?别慌,我已经把代码贴出来了。html部分 <div class="global-page-state"> <div class="installing"> <div class="wave">正在安装</div>...原创 2020-04-07 10:42:46 · 2259 阅读 · 0 评论 -
图片从左至右持续滚动展示
首先,我们先确定HTML结构 <div className="wrapper"> <div class="tech-slideshow"> <div class="mover-1"> <img src="//cdn.cdomdmyxy.c...原创 2020-01-10 09:02:26 · 1217 阅读 · 0 评论 -
javascript平滑滚动页面
roll(key) { if (process.client) { const rollArea = document.querySelector(`.louplus-${key}`) rollArea.scrollIntoView({ block: 'end', behavior: 'smooth',...原创 2019-01-24 13:58:05 · 192 阅读 · 0 评论 -
Vue.js父组件调用子组件的方法
WeChatefb25b299e2777386bceb39366232dde.pngWeChata5fa1887021c5666249d69055a531978.png原创 2019-01-30 18:43:36 · 270 阅读 · 0 评论 -
前端好文章收集
什么是BFChttp://web.jobbole.com/84808/10分钟理解BFChttps://zhuanlan.zhihu.com/p/25321647localStorage,sessionStorage和cookie的区别https://www.cnblogs.com/ke-nan/p/7092663.htmlCookie、session和localStora...原创 2018-03-15 15:53:40 · 106 阅读 · 0 评论 -
JavaScript获得页面卷起的高度
var scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;原创 2019-04-17 11:05:36 · 1457 阅读 · 0 评论 -
JavaScript实现变化的满天星星
原创文章,转载请注明出处。star第一个参数为星星的宽高,第二个参数为周期时长。 function star(maxw,time){ let ele=[]; setInterval(function updata(){ for(let j=0;j<ele.length;j++){ document.body.removeChild(ele[j]); ...原创 2018-04-01 10:11:14 · 127 阅读 · 0 评论 -
Javascript实现UTC转本地时间
moment(moment.utc(commonOne.open_at || new Date()).toDate(), 'YYYY-MM-DD HH:mm:ss'),原创 2019-04-19 18:35:36 · 523 阅读 · 0 评论 -
Javascript实现页面锚点滚动
<template> <div> <ul class="louplus-nav"> <li v-for="(item, index) in nav" :key="index" :ref="item.key" @click="roll(item.key)" ...原创 2019-04-01 14:40:32 · 229 阅读 · 0 评论 -
HTML+CSS实现页面锚点滚动
<ul class="menu"> <li><a href="#html">html</a></li> <li><a href="#css">css</a></li> <li><a href="#js">js</a></li>&...原创 2019-04-01 14:58:12 · 3420 阅读 · 0 评论 -
分享 webpack3.0 的安装与使用
准备开始webpack3.0 的安装之前在很多网站上寻找webpack3.0的知识,但是结果都不理想。经过很多努力,终于学到了一些知识,现在把这些知识分享出来吧。(希望能对小伙伴有所帮助)全局安装1.jpg2.jpg3.jpg4.jpg局部安装5.jpg更新...原创 2017-12-27 17:29:52 · 485 阅读 · 0 评论 -
JavaScript实现文本复制
<!DOCTYPE html><html><body onclick="myFunction(event)"><p>The executeCommand() method executes a specified command on selected text or section.</p><script>d...原创 2018-06-22 15:57:50 · 115 阅读 · 0 评论 -
React 性能优化
React 性能优化简单的 todo-list-demo讲 React 性能优化不能光靠嘴说,得有一个 demo 作为依托,做一个简单的 todolist demo,根据源代码来讲解。顺便体验一下 React 最简单的用法。性能检测安装 react 性能检测工具 npm i react-addons-perf --save,然后在./app/index.jsx中// 性能测试...原创 2018-07-16 21:34:22 · 92 阅读 · 0 评论 -
使用css-loader模块化功能
喜欢的小伙伴点个赞哦。loader: 'css-loader?modules&localIdentName=[path][name]-[local]-[hash]',注意事项:css模块化,只针对类选择器、Id选择器生效;不会将标签选择器模块化。模块化之后,:global()会将当前类设置为全局(即不将其模块化),可以直接以类名的方式使用。:local()则将当前类模块化(...原创 2018-09-27 21:44:21 · 389 阅读 · 0 评论 -
如何使用npm引入bootstrap
喜欢的小伙伴点个赞哦。这几天自己打算做一个项目,把一些前端方面的知识归总一下,顺便学一下thinkphp。项目途中,遇到了很多的问题。我本来一开始打算用element-UI,不打算使用bootstrap,但是最终还是放弃了element-UI。原因无他,用惯了bootstrap,就是觉得element-UI太难用。不过,作为一个长期项目,以后也有肯能会用其他的UI组件替代bootstrap,毕竟...原创 2018-09-22 11:56:16 · 4245 阅读 · 1 评论