lt_1111-CSDN博客

原创对input中type=“file“控件修改上传文件名

我们都知道input中file的name的属性是只读的，要修改名称，需要把file的name属性设置为可写，具体实现如下：<input type="file" id="files" readonly="readonly" onchange="fileUpload()" />function fileUpload(){ let $files = $("files"); if(files.length > 0){ let form = new For

2021-09-28 13:51:35 4770

原创 CSS常用样式汇总

1.文字超出显示省略号/** 单行超出显示省略号 **/p{ width:200rpx; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; }/** 多行超出显示省略号 **/p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: h

2021-09-15 13:47:21 209

原创 JavaScript格式化日期，兼容IE

function getDate(timeDate){ if(!timeDate){return '-'};//空值返回 var date = ""; var time = ""; if(this.getBrowser() == "ie"){ if (timeDate instanceof Date) { date = timeDate; } else if(!is

2021-09-15 09:24:25 393

原创 JavaScript格式化数值，每三位加逗号分隔

function toThousands(num) { num = (num || 0).toString(); let integerNum = 0; let dotNum = 0; if(num.toString().search(".") != -1){ integerNum = num.split(".")[0]; dotNum = num.split(".")[1]; }

2021-09-15 09:23:27 295

原创 JavaScript将JSON数据转换为formData

function jsonToFormData(json, prePath, filters){ var result = {}; if(json instanceof Array && json.length > 0){ for(var i = 0 ; i < json.length; i++){ var subR = this.jsonToFormData(json[i], (prePat

2021-09-15 09:21:46 1568

原创 JavaScript检查浏览器缩放状态

function detectZoom(){ let x = document.createElement('div'); let openControl = false; Object.defineProperty(x, 'id', { get:function(){ // 在这里放入你的代码 openControl = true; }

2021-09-15 09:20:32 413

原创 JavaScript获取浏览器类型

function getBrowser() { let e = navigator.userAgent.toLowerCase(); return window.ActiveXObject || "ActiveXObject" in window ? "ie" : e.indexOf("firefox") >= 0

2021-09-15 09:18:16 168

原创 JavaScript对象的深度拷贝

function deepClone(target){ let result; if (typeof target === 'object') { if (Array.isArray(target)) { result = []; for (let i in target) { result.push(Utils.deepClone(target[i]));

2021-09-15 09:17:20 77

原创 8个JavaScript常用操作数组方法

const students = [ {name: "sam", age: 26, score: 80}, {name: "john", age: 25, score: 86}, {name: "dean", age: 20, score: 78}, {name: "timothy", age: 18, score: 95}, {name: "frank", age: 21, score: 67}]1.map()作用：允许你获取一个数组并将其转换为一个新数组。在这个中，新数组中的

2021-09-11 20:32:47 111

原创 8个常用JavaScript对象方法

1.Object.assign()作用：将所有可枚举的自身属性从一个或多个源对象复制到目标对象。语法：Object.assign(target,…sources)参数：target:目标对象——应用源属性的对象，修改后返回。sources：源对象——包含你要应用的属性的对象。返回值：修改后的目标对象。const target = { a: 1, b: 2 };const source = { b: 4, c: 5 };const returnedTarget = Object.assign

2021-09-11 20:06:15 474

原创常用的JavaScript工具函数

1.反转数字const reverseNumber = n => parseFloat(`${n}`.split('').reverse().join('')) * Math.sign(n);reverseNumber(123); // 321reverseNumber(-200); // -2reverseNumber(32.4); // 4.23reverseNumber(-32.4); // -4.232.判断当前运行环境是否为浏览器const isBrowser = ()

2021-09-11 19:45:33 89

原创常用的JavaScript代码片段

1.使用isNaN(),parseFloat()和isFinite()检查参数是否为数字。function isNumber(number){ return !isNaN(parseFloat(number)) && isFinite(number);}isNumber(5); //returns trueisNumber("Hello"); //returns false2.使用reverse(),split(),join()反转字符串。let str = "Hello

2021-09-11 19:22:08 88

原创 css 的 2D变形（transform）:translate、scale、rotate、skew实现“折叠”界面

先看效果图：html代码部分：<ol class="rules" start="3"> <li>平移属性：translate()、translateX()、translateY()</li> <li>旋转属性：rotate()、rotateX()、rotateY()</li> <li>缩放属性：scale()、scaleX()、scaleY()</li> <li>倾斜属性：skew(

2020-09-02 19:58:16 881 1

原创利用【行内块】让图片和文字都垂直居中显示？

<img class="user-image" src="static/image/test.jpg" /> 大圆脸 ******@qq.com </span&g.

2020-08-28 18:15:54 863

原创运用css的线性渐变画网格背景图

先上效果图body{ background-color:#fff; background-image: linear-gradient(transparent,transparent 50%,rgba(55,110,176,0.3) 50%), linear-gradient(to right,transparent,transparent 50%,rgba(55,110,176,0.3) 50%); background-size:40p

2020-08-28 15:38:08 1141

原创 css背景色rgb、rgba、hsl、hsla、opacity的使用详解

我们先从最简单的例子开始：为整个页面添加背景色。body { background-color:#f7f7f7;}也可以使用更简短的写法：body { background:#f7f7f7;}区别：第二个属性是第一个属性的简写，通过它可以一次性的设置与背景相关的多个属性。上面的例子中，表面上只声明了背景颜色，实则同时也设置了除背景色之外的其它值（比如图片），只不过把其它属性重置为了默认值。上面的例子中，颜色值我使用了十六进制的方法表示。所谓十六进制表示法，就是一个#后加上6位十六进制

2020-08-28 10:55:06 2135

原创 Web字体载入利器（Web Font Loader）使用详解（Web字体加载缓慢解决办法）

网上对web font loader 的使用介绍并不多，我也是在空闲的时候偶然在一本书上看到对于字体加载缓慢的处理方法中有提到一句web font loader。在此之前，我从未使用过web font loader。于是我在网上搜索关于对此的介绍，发现介绍并不多。我想应该目前使用的人也不多吧。以至于没有过多的人在网上对它做详细的介绍。在我查阅的资料中，地址(***https://www.w3ctech.com/topic/1624***)算是写得稍微详细一点的，其余的都不怎么样，当然有可能是我查询的资料不

2020-08-27 19:16:45 3457

lt_1111的博客