陈田田-CSDN博客

原创关于latex公式识别遇到的问题

1、Vue渲染数据和JS加载方法的冲突。实际开发中发现，JS先加载，VUE再获取数据，这样，公式就显示不出来了。解决方法：设置页面2S后再加载JS2、页面翻页后，第二页的公式渲染不出来原因同上，JS已经在再过一遍了。解决方法，在链接上加一个page参数，当page参数改变时重新渲染页面。3、公式识别不全的问题好多公式通过接口识别后都能正常显示，但有一些意外的特例。就算用公式编辑器重...

2019-08-14 15:34:57 2266

原创 elementUI 上传图片不合规范仍会展示在file-list中

解决方法：handleChange(file,fileList){if(file.size / 1024 > 700){var l = this.form.recommend_pic.length;this.form.recommend_pic = this.form.recommend_pic.slice(0,l);this.errortiptoshow(‘图片大小上限700KB...

2019-07-17 15:04:09 2862

原创 ES6新增命令：let

let的介绍let是ES6新增的命令。作用：声明变量。类似于：var。与var的区别：使用let声明的变量，只在其所在的代码块内有效。定义回顾声明变量：可以用var，也可以不用var。是否允许变量提升：允许。是否允许重复声明同一个变量：允许。变量的作用域：全局作用域、函数作用域。在全局作用域中，无论是否使用var，定义的变量都是全局变量。在函数作用域中，使用var定义函数局部...

2018-12-21 16:04:14 245

原创 var、const、let 的区别

定义变量的三种方式var、const、let 都可以用来定义变量，但三者之间存在区别。varvar 声明变量的时候无需初始化。var 声明的变量可在后面进行修改。var 声明的全局变量可以被函数修改。<!DOCTYPE html><html><head> <title></title></head>&...

2018-12-14 11:59:28 217

翻译一篇文章弄懂 JavaScript 中的 import

import 语句用于导入由另一个模块导出的绑定。无论是否声明了 strict mode，导入的模块都运行在严格模式下。import语句不能在嵌入式脚本中使用。语法import defaultExport from “module-name”;import * as name from “module-name”;import { export } from “module-name”;...

2018-12-07 15:35:31 3226

原创 CSS设置选中网页文字时的背景和颜色

CSS设置选中网页文字时的背景和颜色在网页中，选中某段文字，默认的显示效果为：可以看到，选中后文字颜色为白色，背景为蓝色。现我们想设置，选中后文字为红色，背景为黄色。需要用到CSS伪类 ::selection。IE9+、Opera、Google、Chrome、Safari都支持 ::selection 选择器。Firefox 通过其私有属性 :: moz-selection 支持。设...

2018-12-06 14:38:35 4337

原创微信小程序教程：文字超出显示区域后隐藏并显示省略号

单行文字超出后隐藏首先容器需要有固定的宽高，其次加入以下代码即可。view { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}多行文字超出后隐藏容器不需要有固定的宽高，只需加入以下代码即可。无需指定高度，只需指定最多显示几行，属性 -webkit-line-clamp。本示例中最多显示3行...

2018-11-27 12:46:00 1636

原创 CSS和网络性能

CSS和网络性能CSS对于呈现页面至关重要 - 在找到、下载和解析所有CSS之前，浏览器不会开始呈现 - 因此我们必须尽可能快地将其放到用户的设备上。关键路径上的任何延迟都会影响我们的“开始渲染”，并让用户看到空白屏幕。什么是大问题？从广义上讲，这就是CSS对性能至关重要的原因：浏览器在构建渲染树之前无法渲染页面;渲染树是DOM和CSS组合结果;DOM是HTML加上需要对其进行操作的...

2018-11-23 15:38:29 344

原创微信小游戏开发（11）-文件系统

文件系统文件系统是小程序提供的一套以小程序和用户维度隔离的存储以及一套响应的管理接口。通过wx.getFilesSystemManager()可以获取到全局唯一的文件管理器，所有文件管理操作通过FileSystemManager来调用。 ··· var fs = wx.getFileSystemManager(); ··· 文件主要分为两大类： 代码包文件：代码包文件指的是在项目目...

2018-09-03 21:07:14 1302 1

原创微信小游戏开发（10）-音频播放

小游戏内只有一种音频播放的方式，即使用InnerAudioContext来播放。使用InnerAudioContext播放通过wx.createInnerAudioContext()接口可以创建一个音频实例innerAudioContext，通过这个实例可以播放音频。 ··· var audio = wx.createInnerAudioContext(); audio.src ...

2018-09-03 21:05:08 2700

原创微信小游戏开发（9）- 分包加载

随着小游戏的玩法越来越丰富，开发者对于扩大包大小的需求越来越强烈，所以微信推出了小游戏分包加载这一个功能。所谓的分包加载，即把游戏内容按照一定的规则拆分成几个包，在首次启动时先下载必要的包，这个必要的包我们称为【主包】，开发者可以在主包内触发其他分包的下载，从而把首次下载的耗时分散到游戏运行中。分包加载包大小限制目前小游戏分包大小有如下限制： 整个小游戏所有包大小不超过8M ...

2018-08-31 09:47:16 4306 1

原创微信小游戏开发（8）-模块化

模块化小程序提供了CommonJS风格的模块API，可以通过module.expotrs和exports导出模块，通过require引入模块。我们在根目录下新建文件夹src，再在src中新建文件夹util，在util中新建module.js。|----src| |----util| |----module.js在module.js中编写一个方法，将hero.pn...

2018-08-30 15:07:12 558

原创微信小游戏开发（7）-支持情况和运行环境

一、支持情况基本上所有基于HTML5的游戏引擎都是依赖于浏览器环境提供的BOM和DOM API，但是小程序是一个不同于浏览器的JavaScript运行环境，没有BOM和DOM API。因此如果要在小游戏中使用引擎，需要对引擎进行改造。目前，Cocos，Egret，Laya 已经完成了自身引擎及其工具对小游戏的适配和支持，对应的官方文档也对接入小游戏的开发做了介绍，具体可查阅官方文档。 U...

2018-08-29 13:38:26 1056

原创微信小游戏开发（6）-Adapter

Adapter 小游戏的运行环境在IOS上是JavaScriptCore，在Android上是V8，都是没有BOM和DOM的运行环境，没有全局的document和window对象。但通过调用微信官方提供的Adapter后，就可以调用BOM和DOM的方法了。所谓的Adapter是一个抽象的代码层，并不特指某一个适配小游戏的第三方的库。它是使用wx API 模拟BOM和DOM的代码组成的库，...

2018-08-27 17:23:00 1219

原创微信小游戏开发（5）-全局对象和文件限制类型

一、全局对象window对象是浏览器环境下的全局对象。小游戏运行环境中没有BOM API，因此没有window对象。但是小游戏提供了全局对象GameGlobal，所有全局定义的变量都是GameGlobal的属性。console.log(GameGlobal.setTimeout === setTimeout);console.log(GameGlobal.requestAni...

2018-08-24 09:27:02 1612

原创微信小游戏开发（4）-动画和触摸事件

一、动画在JavaScript中，一般通过setInterval、setTimeout、requestAnimationFrame来实现动画效果。微信小游戏对这些API提供了支持：setInterval()setTimeout()requestAnimationFrame()clearInterval()clearTImeout()cancelAnimationF...

2018-08-23 09:16:44 2804

原创微信小游戏开发（3）

一、wx API 我们只能用JavaScript来编写小游戏。小游戏的运行环境是一个绑定了一些方法的JavaScript VM。不同于浏览器，这个运行环境没有BOM和DOM API，只有wx API。接下来我们将介绍如何用wx API 来完成创建画布、绘制图形、显示图片的基础功能。二、创建Canvas 调用wx.createCanvas() 接口，可以创建一个Canvas对象。 ...

2018-08-22 09:45:02 2507 1

原创微信小游戏开发（2）

一、文件结构在上一节中，我们已经看到了小程序开发的界面。在界面中的中间部分，为文件结构区域：可以看到该项目中有： audio文件夹：用来存放音频文件； images文件夹：用来存放图片文件； js文件夹：用来存放脚本文件； .game.js文件； .game.json文件； .project.config.json文件。其中，只有两个是小程序的必要文件： ① game...

2018-08-21 10:13:00 2344

原创微信小游戏开发（1）

一、安装开发工具前往开发者工具下载页面，网址：https://developers.weixin.qq.com/minigame/dev/devtools/download.html，根据自己的操作系统下载对应的安装包进行安装。二、创建小游戏项目 1、打开微信开发者工具，选择小程序项目。 2、此时需要输入三项内容：项目目录、APPID、项目名称。其中，项目目录是你在本地存放...

2018-08-20 15:33:51 8475

原创 CSS清除浮动方法大全

一、浮动产生的原因子元素使用了 CSS 的 float 属性后，脱离了文档流，导致其父元素高度无法被撑开，从而引起父元素的某些 CSS 属性无法正常显示，同时导致后续元素的显示位置出现错位。示例代码：页面效果：我们可以看到：①父元素 out-box 没有被撑开；②父元素 out-box 后面的 p 元素也收到了影响。二、解决方法方法1：为父元素设置高度 .out-box { height

2017-11-23 18:35:39 319

原创前端面试题-20170802

**诚邀您加入前端交流群580256837进行学习交流或获取本面试题答案！另外群中会定期分享前端面试题、前端书籍、前端特效等前端领域知识！让我们一起努力，成就更好的自己！**1.JS类执行以下代码会报什么错误？如何纠正？ 2.JS类执行如下代码，会得到什么结果？如何纠正？

2017-08-02 12:33:45 694

原创使用CSS3实现加载中动画

在以往的网页制作中，通常会使用一个GIF图片来表达loading效果。但随着CSS3的兴起与发展，越来越多的加载中特效可以通过动画效果来实现。这样做得好处是： 1.较少http请求， 2.解决GIF图片失真的问题， 3.便于大小以及颜色的调整。以下为博主新制作的一个loading效果图：部分代码截图如下: 下载源文件，可进入 QQ 前端交流群 580256837，下载【CSS3实

2017-07-04 15:20:18 1224

原创 js判断是否在微信浏览器中打开

用JS来判断了，经过查找资料终于实现了效果，直接上代码function is_weixn(){ var ua = navigator.userAgent.toLowerCase(); if(ua.match(/MicroMessenger/i)=="micromessenger") { return true; } else {

2017-04-11 16:34:42 790

原创兼容问题——间距

【趣皮士】微信公众号，问答详情页在PC端显示正常，在手机端会有间隙。PC端效果图手机端效果图原因：并不是间距样式的问题，而是因为图片的问题在PC端图片不存在时，其不占空间，但在手机端它是需要占有空间的。将代码从原来的的：改为：

2017-04-06 16:45:56 564

原创 JS实现打开链接的功能

1.超链接Welcome等效于js代码window.location.href=”http://www.jb51.net”; //在同当前窗口中打开窗口2.超链接Welcome等效于js代码window.open(“http://www.jb51.net“); //在另外新建窗口中打开窗口

2017-04-01 12:35:40 21490 1

原创微信原生alert带有URL的问题

重写alert方法<script> window.alert = function(name){ var iframe = document.createElement("IFRAME"); iframe.style.display="none"; iframe.setAttribute("src", 'data:text/plain,');

2017-03-31 17:53:14 3277

1.写一个方法，在一个未知对象中，找出所有的“学习交流”，并 console.log 对象输出它的引用地址，以及对应值以及当前所在对象和当前对象有多少个目标值。 vartarrgetObj = { a:{ b:{ c:{ d:{ e:{ name:”百度”} }, l:{ name:”学习交流–> 群:97345400”} } } }, d:”90”, e:”90”, l:{ a:{ b:{ c:

2017-03-21 16:24:27 690

原创将多个参数拼接到一起，传递给后台

在与后台交互的过程中，会遇到需要将同一类的多个参数传递给后台的情况。这个时候的解决方法是将这些同类的参数拼接为一个参数，传递给后台。代码如下：<!DOCTYPE html><html><head> <title></title> <script type="text/javascript" src="jquery-1.11.3.min.js"></script></head>

2017-03-20 11:49:12 4663

原创动态给select赋值

当点击页面中的一些元素，会改变select的值，这样的情况比较多见。代码如下：<!DOCTYPE html><html><head> <title></title> <script type="text/javascript" src="jquery-1.11.3.min.js"></script> <style type="text/css"> sele

2017-03-20 11:27:02 8216 2

原创 box-sizing属性值和作用

兼容问题首先，box-sizing属性在FireFox中存在兼容问题，所以需要使用-moz-box-sizing做一下兼容。属性值box-sizing：content-boxbox-sizing：border-boxbox-sizing：inheritcontent-box这是box-sizing的默认属性值是CSS2.1中规定的宽度高度的显示行为在CSS中定义的宽度和高度就对应到

2017-01-20 17:45:18 11448

原创清除浮动常用方法

为什么要清除浮动浮动会使当前标签产生向上浮的效果，导致不同浏览器在计算父级元素高度，或者显示前后标签位置的时候产生意想不到的问题。清除浮动的方法为父元素定义height设置父元素浮动，同时为其设置高度在浮动元素的后面添加一个空的div标签，并为新添加的标签设置clear：both在浮动元素的后面添加一个空的br标签，并为新添加的标签设置clear：both为父元素设置overflow：

2017-01-20 12:47:31 539

原创行内元素与块级元素的区别，行内块级元素在IE8-的兼容性

行内元素与块级元素的区别行内元素最好不要包裹块级元素，但是块级元素可以任意的包裹行内元素行内元素如果其上一个元素也是行内元素，则他们会分布在统一水平线上，即在一行上排列，块级元素不论上一个元素是行内元素还是块级元素都要另起一行，单独占一行。对于行内元素设置with、height、margin值无效，但对于块级元素，设置这些值是有效的。行内块级元素在IE8以下的兼容性div { dis

2017-01-19 17:10:18 3563

原创浏览器与内核

在前端的开发工作或是面试过程中，经常会用到关于浏览器及其内核的知识。tt在这里给大家总结一下。- 浏览器 —— 内核 - 谷歌浏览器 Chrome —— Webkit - 火狐浏览器 FIreFox —— Gecko - 微软浏览器 IE —— Trident - 苹果浏览器 Safari —— Webkit

2017-01-19 16:01:15 617

原创鼠标划上之cursor

用户在使用浏览器查看页面时，许多鼠标划上的操作可以提升用户体验度。比如在默认的文字上显示的是光标，在可点击的链接处显示的是手型，可以说这两种使我们最为常用的显示方式。但除了这些之外，还有许多的鼠标划上显示方式，如下如：对应于cursor可以使用的值都在上面的表格中，这里是一段示例代码，大家可以复制感受一下。<!DOCTYPE html><html><head> <title>c

2017-01-18 19:00:16 471

原创 button按钮

button按钮的type属性有： ①type=“button” ②type=“submit” ③type=“reset”对应的每一种的作用分别为： ①type=“button”，表示为一个普通的按钮 ②type=“submit”，表示提交，作用是提交其所关联的表单 ③type=“reset”，表示重置，作用是将其所关联的表单中的输入值重置。引申： button和input type=

2017-01-18 18:48:56 581

原创 JavaScript函数基本概念

1.函数是一段只定义一次，但可能被执行或调用任意次的JavaScript代码。 2.JavaScript函数是参数化的：函数的定义会包括一个称为形参的标识符列表，这些参数在函数体中像局部变量一样工作。 3.函数调用会为形参提供实参的值。 4.函数使用它们实参的值来计算返回值成为函数调用表达式的值。 5.除了实参之外，每次调用还会拥有另一个值——本次调用的上下文——这就是this关键字的值。6

2017-01-16 14:11:31 673

原创 JavaScript之函数入门详解

函数是一段只定义一次，但可能被执行或调用任意多次的JavaScript代码。JavaScript中对的函数是参数化的：函数的定义会包括一个称为形参的标识符列表，这些参数在函数体中像局部变量一样工作。函数调用会为形参提供实参的值。函数使用它们实参的值来计算返回值，成为该函数调用表达式的值。除了实参之外，每次调用还会拥有另一个值——本次调用的上下文——这就是this关键字的值。如果函数挂载在一个对象上，

2016-12-08 17:21:36 702

原创阻止默认行为（二）

之前tity发表了一篇【阻止默认行为】的文章。在那篇文章中，给大家讲解了基于jQuery的event.preventDefault()方法，今天给大家介绍通过return false来阻止默认行为的方法。<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>阻止默认行为</title> <script typ

2016-12-08 12:30:36 497

原创解决 jQuery Validate 在IE8中不兼容的问题

表单在HTML中占据着重要的地位，在客户端对表单进行验证也是前端工作中非常重要的一个环节，在这种形势下表单验证插件也应用而生，其中最为杰出的要数 jQuery Validate。但是与很多常见的插件一样，对于IE9之下的浏览器支持度并不好。今天tity在这里给大家提供一种使得jQuery兼容IE8的方法：在未压缩的validate.js文件中找到如下代码（446行附近）：return $([])

2016-12-08 12:21:19 4239