oAh1993-CSDN博客

原创一些常用的css新特性（汇总）

1.position：sticky；当元素在容器中被滚动超过指定的偏移值时，元素在容器内固定在指定位置。亦即如果你设置了top: 50px，那么在sticky元素到达距离相对定位的元素顶部50px的位置时固定，不再向上移动（相当于此时fixed定位）。...

2020-07-24 12:41:34 184

请说出以下代码的执行结果：下面展示一些内联代码片。//代码片段setTimeout(() => { console.log('我是setTimeout里的代码');}, 0)console.log(222);大家猜一下打印出来的结果会是什么呢？下面解释一下原因：因为JavaScript 是单线程执行的，也就是无法同时执行多段代码。当某一段代码正在执行的时候，所有后续的任务都必须等待，形成一个队列，一旦当前任务执行完毕，就会接着执行队列中的下一个任务。这也常被称为 “阻塞式执行”

2020-07-23 22:57:51 1314 1

原创关于PDF文件流的下载

最近遇到要下载pdf的需求，于是一顿乱敲代码，成功。代码如下，axios请求里的代码复制粘贴即可使用： getAgreementDetailRequest().then(res => { console.log(res); let url = window.URL.createObjectURL(new Blob([res])) console.log(url); let link = document.createElement.

2020-06-29 10:50:15 1146

原创滚动条插件 nicescroll 的使用

最近写项目需要美化页面的滚动条，于是接触了nicescroll这个滚动条美化插件。具体用法如下图代码所示：/*美化滚动条*/function scroll(id){ $(id).niceScroll({ cursorcolor:"#1c4780", // 滚动条颜色，使用16进制颜色值 cursoropacitymax: 1, // 当滚动条是显示...

2018-11-21 17:13:44 305

转载 class命名规则

CSS样式命名说明网页公共命名 #wrapper或#wrap 页面外围控制整体布局宽度 #container或#content 容器,用于最外层 #layout 布局 #head, #header 页头部分 #foot, #footer 页脚部分 #nav 主导航 #subnav 二级导航 #menu 菜...

2018-08-02 09:53:48 1017

转载从前端和后端两个角度分析jsonp跨域访问（完整实例）

一、什么是跨域访问举个栗子：在A网站中，我们希望使用Ajax来获得B网站中的特定内容。如果A网站与B网站不在同一个域中，那么就出现了跨域访问问题。你可以理解为两个域名之间不能跨过域名来发送请求或者请求数据，否则就是不安全的。跨域访问违反了同源策略，同源策略的详细信息可以点击如下链接：Same-origin_policy；总而言之，同源策略规定，浏览器的ajax只能访问跟它的HTML页面同源...

2018-08-01 11:21:47 195

原创 jQuery中width()，innerWidth(),outerWidth(),outWidth(true)的区别

var w='元素本身的宽度';width()==w;innerWidth()==w+padding;outerWidth()==w+padding+border;outerWidth(true)==w+padding+border+margin;注意：这些方法只用于jQuery

2018-07-27 14:32:38 872

原创 window.history.go()和history.back()以及location.reload()的用法以及不同

window.history.go(-1); 返回上一页, 原页面表单中的内容会丢失;window.history.back(-1); 返回上一页, 原页面表单中的内容会保留.以下为举例：<input type="button" value="刷新" onclick="window.location.reload()"><input type="butto...

2018-07-20 10:32:55 12324

转载用js如何获取UA（user Agent）用户代理？

<!DOCtype html> <html> <head> <title></title> </head> <body onload="whatBrowser()"> <script> function whatBrowser()

2018-07-17 14:20:18 2212

原创 URL调用高德地图导航

http://uri.amap.com/navigation?from=" + fromLongitude + "," + fromLatitude + "&to="+ longitude + "," + latitude + "&mode=car&src=nyx_super;fromLongitude ,fromLatitude : 起始点经纬度longitud...

2018-07-04 19:37:42 9590 1

原创关于a标签的click事件

推荐写法 <a href="javascript:void(0)" onclick="doSomething()">链接</a> javascript:void(0) 相当于一个死链接，href 不执行

2018-07-04 14:26:27 9251

原创关于IE浏览器new Date()带参返回NaN解决方法

通过Date.parse()方法 var dateTime="2014-01-01 12:11:12"; Date.parse(dateTime.replace(/-/g,"/"));

2018-06-15 16:58:17 479

原创 JQ里attr()可同时设置多个属性值

attr() 方法也允许您同时设置多个属性。下面的例子演示如何同时设置 href 和 title 属性：实例$("button").click(function(){ $("#w3s").attr({ "href" : "http://www.w3school.com.cn/jquery", "title" : "W3School jQuery Tutorial&q

2018-04-17 18:01:34 14122

原创 jQuery动画——animate()

1.jQuery animate() 方法用于创建自定义动画语法：$(selector).animate({params},speed,callback);必需的 params 参数定义形成动画的 CSS 属性。可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。可选的 callback 参数是动画完成后所执行的函数名称。下面...

2018-04-17 17:31:46 563

转载 :after/::after和:before/::before的作用及使用方法

1. :before 和 :after 的主要作用是在元素内容前后加上指定内容，示例：HTML代码：<p>你好</p>CSS代码：p:before{ content: 'Hello'; color: red;}p:after{ content: 'Tom'; color: red;}效果如图：以上代...

2018-04-13 16:30:37 2530

转载启动redis出现Creating Server TCP listening socket *:6379: bind: No such file or directory

[6644] 02 Apr 23:11:58.976 # Creating Server TCP listening socket *:6379: bind: No such file or directoryredis报错：[6644] 02 Apr 23:11:58.976 # Creating Server TCP listening socket *:6379: bind: No ...

2018-04-13 15:52:18 283

原创 jQuery 名称冲突

jQuery 使用名为 noConflict() 的方法来解决该问题。var jq=jQuery.noConflict()，帮助您使用自己的名称（比如 jq）来代替 $ 符号。

2018-04-11 15:45:35 279

原创 jQuery选择器

1.jQuery 元素选择器$("p") 选取 <p> 元素。$("p.intro") 选取所有 class="intro" 的 <p> 元素。$("p#demo") 选取所有 id="demo" 的 <p> 元素。$("ul li:first") 选取每个<ul&gt

2018-04-11 15:42:08 121

转载 jq实现类名（class）的增删改查

一个标签可以指定多个class1. 增加一个class：　　$(".default").addClass("hover_s");2. 移除一个class：　　$(".default").removeClass("default ");3.修改一个class：　　3.1 可以分两步走：　　　　① 先增加一个你要增加的class　　　　　　$(".default")...

2018-04-10 18:09:21 6099

原创 textarea设置背景图片

2018-04-10 18:08:07 3184

原创 JS打开新窗口的2种方式

1.超链接<a href="http://www.baidu.com" title="我是新打开的页面">Welcome</a>等效于js代码window.location.href="http://www.baidu.com"; //在同当前窗口中打开窗口 2.超链接<a href="http://www.baidu.com" tit

2018-03-01 13:57:00 3294

原创微信小程序实现上传图片/预览放大/删除图片功能

// pages/common/uploadImage.jsconst netUtil = require("../../utils/netUtil");const util = require("../../utils/util.js");import {colors} from '../../utils/colors';var app = getApp();Page({...

2018-03-01 11:13:50 9474

转载移动端长按文字复制功能

遇到的问题微信上要实现一个点击复制兑换码的功能，上网找了很久，找到了zero clipboard插件只能在PC端用，手机端并没有比较好的解决方案，无奈苦逼找产品商量，改为长按复制。解决方案微信默认就是支持文本长按选择，所以只需要调整字体样式后，几乎不需要写什么代码，这份任务就完成了，但是。。。情况并不如我所想。找了半天并没有发现什么异样，但是就是长按无法复制。解决思路 1.新...

2018-03-01 11:09:06 45650

原创 JS 实现简单星星评分功能

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1&qu

2018-03-01 11:05:42 1568

转载 css3背景颜色渐变属性

很久之前写的一篇文章了，今天重新整理一下关于css3背景渐变的写法，至于是怎么来的，可以看下面渐变的详细解释。在项目中，有很多地方都用到了背景线性渐变。如果在移动端还可以适当使用CSS3这个属性css3：linear-gradient比如：黑色渐变到白色，代码如下：.gradient{ background: -moz-linear-gradient(top, #0000...

2018-03-01 11:01:16 362

原创 CSS实现单行、多行文本溢出显示省略号（…）

如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来，当然还需要加宽度width属来兼容部分浏览。实现方法：overflow: hidden;text-overflow:ellipsis;white-space: nowrap;: hidden;text-overflow:ellipsis;white-space: nowrap;...

2018-03-01 10:59:24 143

原创 css实现强制不换行/自动换行/强制换行

css实现强制不换行/自动换行/强制换行 1. 强制不换行div{ white-space:nowrap;}2. 自动换行div{ word-wrap: break-word; word-break: normal;}3. 强制英文单词断行 div{ word-break:break-all; }4. CSS设置不转行...

2018-03-01 10:57:39 2491

转载简单的利用JS来判断页面是在手机端还是在PC端打开的方法

　 Navigator对象　　首先来了解一下Navigator 对象，Navigator 对象包含有关浏览器的信息，下面的userAgent 属性是一个只读的字符串，声明了浏览器用于 HTTP 请求的用户代理头的值。所以我们可以通过判断navigator.useragent里面是否有某些值来判断，比如我的电脑是mac，所以打印出来的值为 Mozilla/5.0 (Macintosh;...

2018-03-01 10:55:23 160

转载 JQuery实现input上传图片显示缩略图

最近做一套手机商城页面，在退款申请页面有上传图片显示缩略图的功能，以前没有做过这个，所以整理了一下。首先 HTML ：<p>上传图片：</p> <div id="imgPreview"></div> <span class="upload-img"><input id=&q

2018-03-01 10:54:37 375

转载 HTML5 实现手机拍照上传

页面样式：上传图片有原生的方法<input type="file" accept="image/*">，如果只想要拍照上传，不希望用户选择图片上传，可以通过添加capture属性，该属性值有camcorder/microphone/camera...，此处选择camera。PS：该属性存在浏览器兼容性问题，不是所有的浏览器都支持。 <input type="fil...

2018-03-01 10:52:54 1099

转载 javascript中的返回函数与闭包

在Javascript中没有类的概念，函数就是第一类对象。函数就是对象，主要的表现形式有：1. 函数可以在运行时创建，也可以在运行的过程中创建。2. 函数可以被分配给其他变量，可以将它们的引用复制给其他变量。3. 函数可以作为参数传递给其他函数，可以作为其他函数的返回值返回。4. 函数可以有自己的属性和方法。本文将重点讨论函数作为返回值的形式。例如： var setup = func...

2018-03-01 10:50:21 1094

原创瀑布流无限加载（原生js）

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" h

2018-03-01 10:41:31 483

原创简单封装ajax

(function (window) { //避免污染全局变量 function ajax(options) { var init = { type: 'get', url: "", data: {}, async: true, ...

2018-03-01 10:40:03 114

原创 JS获取浏览器窗口大小获取屏幕，浏览器，网页高度宽度问题

网页可见区域宽：document.body.clientWidth 网页可见区域高：document.body.clientHeight 网页可见区域宽：document.body.offsetWidth (包括边线的宽) 网页可见区域高：document.body.offsetHeight (包括边线的宽) 网页正文全文宽：document.body.scrollWidth 网页正文...

2018-03-01 10:27:10 156

转载 A链接标签点击不会触发任何行为的写法

<a href="JavaScript:void(0);"></a>javascript:void(0);字串处可以用'#'也可以用'javascript:'，但是#会默认指向页面顶端，因为该标志是锚点标志，而后者不带void(0)的写法也可以，但不是一个好的写法习惯，因此推荐上例写法。用途可以用于一些特殊的页面特效一定要有A标签，并且希望A标签不会起到除了作为一个标签...

2017-08-24 11:35:55 1212

转载前后、左右、去掉所有的空格的正则表达式

1去掉左边空格name.replace(/^\s*/g,"");2去掉右边空格name.replace(/\s*$/g,"");1去掉前后空格smSmsModelName.replace(/(^\s*)|(\s*$)/g,"")2去掉所有的空格name.replace(/\s+/g,"")3 手机号码的正则表达式varpart

2017-08-24 11:33:20 683

hiro_1015的博客

原创 2020一些web前端面试题（不定时更新）