【我在一个前端项目中用js整理的一些通用方法，其中使用到的思想，主要就是约定了。】的更多相关文章

我在一个前端项目中用js整理的一些通用方法，其中使用到的思想，主要就是约定了。

把名称和后台来的json数据约定起来,可以达到的效果就是可以将东西统一化,减少差异,提升模块等的通用性,此后就可以实现具体不同模块内容可以自动或拷贝赋值的方式 2016.7.18 refactor string formatter code: String.prototype.format = function () { var that = this; var params = arguments; function applychange(arrayorobject) { for (var…

thinkphp在前端页面的js代码中可以使用 U方法吗? 可以使用模板变量如__URL__等吗?

thinkphp在前端页面的js代码中可以使用 U方法吗? : 可以的! tp的U方法, 是"全局的", 什么是全局的? 就是, 可以在 "任何地方"使用的: 可以在前端使用, 这里的前端页面, 说的是, 整个html前端页面, 既然是整个html页面, 就是说, 既可以在dom 元素中body中使用, 主要是ajax, 超链接a的href等地方; 更是指: html页面中的 js代码中 但是, 要注意, U方法可以在任意地方使用, 包括前端页面和后端页面, 两者的…

Asp.Net中用JS中操作cookie的方法

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="cookies.aspx.cs" Inherits="File_cookies" %> <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>&…

js文件流下载通用方法

通常我们会用到文件流下载文件,下面给大家一个通用的文件流下载的js /* *下载文件 * options:{ * url:'', //下载地址 * isNewWinOpen:false,是否新窗口打开 * data:{name:value}, //要发送的数据 * method:'post' * } */ function downLoadFile(url, data, method, isNewWinOpen) { var config = { url: url, data: (data =…

js写的一些通用方法

Js获取当前浏览器支持的transform兼容写法 // 获取当前浏览器支持的transform兼容写法 function getTransfrom() { var transform = '', // document.createElement() 创建元素节点, divStyle = document.createElement('div').style, // 返回的是一组object对象,里面包含了transform // 可能涉及到的几种兼容性写法,通过循环,找出浏览器识别的那个 /…

javascript功能插件大集合 前端常用插件 js常用插件

转载来源:https://github.com/jobbole/aw... 包管理器管理着 javascript 库,并提供读取和打包它们的工具.•npm – npm 是 javascript 的包管理器.•Bower – 一个 web 应用的包管理器.•component – 能构建更好 web 应用的客户端包管理器.•spm – 全新的静态包管理器.•jam – 一个专注于浏览器端和兼容 RequireJS 的包管理器.•jspm – 流畅的浏览器包管理器.•Ender – 没有库文件的程序…

在基于ABP框架的前端项目Vue&Element项目中采用日期格式处理，对比Moment.js和day.js的处理

Day.js 是一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样. 如果您曾经用过 Moment.js, 那么您已经知道如何使用 Day.js.简单地说,只要你会Moment.js,那么你就会Day.js! 但是我们知道的,Moment.js 的大小是200多KB,而Day.js的大小却是2 KB,瘦身很多但却几乎拥有同样强大的 API. 现在框架基本上都是多端应用的了,所以在ABP框架中整合Winform管理端.Vue&element的…

前端框架Vue.js——vue-i18n ，vue项目中如何实现国际化

本项目利用  VueI18n 组件进行国际化,使用之前,需要进行安装 $ npm install vue-i18n 一.框架引入步骤: 1. 先在 main.js 中引入 vue-i18n. // 国际化插件 import utils from '@/config/cookieUtils' import VueI18n from 'vue-i18n' Vue.use(VueI18n) // 通过插件的形式挂载 let currentLang = utils.get('CurrentLang')…

前端（小程序）项目Aes.js/Md5.js加密的处理方法

做项目中需要对前端数据加密传输这个时候需要用到前端加密的算法主要是:Aes.js,Md5.js 一.Vue项目用到的aes.js加密. 1.直接在index.html引入aes.js或者在npm install 安装. 2.加密代码要放在Vue项目的assets目录这样build的时候可以压缩,在浏览器上不容易找到加密处理的方法. 3.使用的时候在调用接口的地方引入或者在main.js引入: 4.掉接口的时候使用 我项目aes_encrypted.js代码: function aes_encry…

在Vue&Element前端项目中，使用FastReport + pdf.js生成并展示自定义报表

在我的<FastReport报表随笔>介绍过各种FastReport的报表设计和使用,FastReport报表可以弹性的独立设计格式,并可以在Asp.net网站上.Winform端上使用,由于其主要是使用.net后端生成的报表方式,如果不考虑其在线设计处理,那么可以在在Vue&Element前端项目中使用,通过后端生成报表PDF文件,然后通过前端使用pdf.js来呈现报表最终效果即可. 1.使用FastReport生成自定义报表 我们通过定义自己FastReport报表格式,然后在后端…

前后端分离之前端项目构建（grunt+require+angular）

前言 前段时间做了一个项目,前端开发页面,然后把代码给到后端同学,后端同学通过vm再来渲染页面.后来才发现,这种方式简直是太low了,因为前端代码在服务端同学那里,每次前端需要更改的时候都需要去到服务端同学那里修改代码,维护成本高,卖力不讨好＝＝ 工作了这么久,深深的感受到了那句名言的魅力,时间就是金钱呀!后来我发现,现在的web开发,谁还用这种低级的方法,大家都已经开始搞前后端分离了! 前后端分离的目的和作用 要弄清前后端分离的目的和作用,首先要知道什么是前后端分离. 现在的web前端越来越偏…

使用gulp来构建一个前端项目

什么是gulp? gulp是一个前端项目构建工具,是自动化项目的构建利器,它不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成.你可以使用gulp及其插件对你的项目代码(less,sass)进行编译,还可以压缩你的js和css代码,甚至压缩你的图片等等. 我看了很多网上的资料,目前最流行的两种使用JavaScript开发的构建工具是Grunt和Gulp.而grunt多用在文件较多,逻辑复杂的项目构建,如果只是用来管理小项目的话,gulp方便快捷,是最适合不过的了.…

gulp + webpack 构建多页面前端项目

修改增加了demo地址 gulp-webpack-demo 之前在使用gulp和webpack对项目进行构建的时候遇到了一些问题,最终算是搭建了一套比较完整的解决方案,接下来这篇文章以一个实际项目为例子,讲解多页面项目中如何利用gulp和webpack进行工程化构建.本文是自己的实践经验,所以有些解决方案并不是最优的,仍在探索优化中.所以有什么错误疏漏请随时指出. 使用gulp过程中的一些问题,我已经在另外一篇文章讲到了 grunt or gulp 前言 现在为什么又整了一个webpack进来呢…

web开发前端面试知识点目录整理

web开发前端面试知识点目录整理 基本功考察 关于Html 1. html语义化标签的理解; 结构化的理解; 能否写出简洁的html结构; SEO优化 2. h5中新增的属性; 如自定义属性data, 类名className等, 新增表单元素, 拖拽Drag 3. h5中新增的API, 修改的API, 废弃的API 稍作了解 (离线存储, audio, video) 关于CSS 1. CSS选择器( 三大特性 ) 2. BFC机制 3. 盒模型 4. CSS模块化开发(封装); SCSS和LES…

前端项目模块化的实践2：使用 Webpack 打包基础设施代码

以下是关于前端项目模块化的实践,包含以下内容: 搭建 NPM 私有仓库管理源码及依赖: 使用 Webpack 打包基础设施代码: 使用 TypeScript 编写可靠类库 使用 TypeScript 的收益 使用 Mocha/Jest 进行单元测试 [实现中] 本文是关于前端项目模板化的第2部分 现状 实际项目远远比示例使用的 myGreeting 复杂,比如 为了提高可维护性我们将项目折成了许多功能模板: 我们希望使用 Promise 等语法等,但是顾忌目标环境的支持能力: 可能依赖了多个第三…

erp前端项目总结

目录 一.项目目录(vue-cli2) 二.开发实践 (一) 权限 (二) 各组件间传递数据 (四) 路由 (七) 组织部门业务员三级联动 (八) 优化性能,手动绑定下拉框数据 (九) 验证 (十) 打印 (十一) 签名 三.代码规范 (一) JS规范 (二) Vue规范 (三) 命名规范 (四)文本编辑器规范 四.优化内容 太极ERP前端开发总结 一.项目目录(vue-cli2) ├── build ├── config ├── dist //打包后生成的静态页面文件 ├── src │ ├─…

为什么 ReactJS 不适合复杂的前端项目？

问题一:ReactJS组件难以在复杂交互页面中复用 ReactJS中的最小复用单位是组件.ReactJS的组件比AngularJS的Controller和View 要轻量些. 每个组件只需要前端开发者提供一个 render 函数,把 props 和 state 映射成网页元素. 这样的轻量级组件在渲染简单静态页面时很好用, 但是如果页面有交互,就必须在组件间传递回调函数来处理事件. 我将在<More than React(二)组件对复用性有害?>中用原生DHTML API.ReactJS和Bi…

前端项目自动化构建工具——Webpack入门教程

参考资料:https://www.webpackjs.com/(中文文档)   https://www.webpackjs.com/(官方文档) 首先有必要说明一下,本文侧重讲解webpack基本配置属性,不附带实例,将会以通俗易懂的形式地讲解:如若需要实例进行相关练习,可将本文作为理论基础: Webpack是前端项目自动化构建工具,本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应用程序时,它会递归地构…

react 前端项目技术选型、开发工具、周边生态

react 前端项目技术选型.开发工具.周边生态 声明:这不是一篇介绍 React 基础知识的文章,需要熟悉 React 相关知识 主架构:react, react-router, redux, redux-thunk, redux-saga, react-redux, dva, umi 扩展架构:styled-components, recompose, react-loadable UI 框架:ant-design, ant-design-mobile, material-ui, Seman…

实践案例丨教你一键构建部署发布前端和Node.js服务

如何使用华为云服务一键构建部署发布前端和Node.js服务 构建部署,一直是一个很繁琐的过程 作为开发,最害怕遇到版本发布,特别是前.后端一起上线发布,项目又特别多的时候. 例如你有10个项目,前后端都要同时发布,那么就需要多次合并代码.构建,重复很多动作..而且还要去关心构建机器环境是不是变了?配置是否能扛住同时构建多个应用?人为的操作次数多了,就很难保证万无一失. 那这种局面怎么破? 是不是要考虑从技术角度来提效? 假如我把所有的构建.发布都迁移到云端,可以一键push代码,然后自动完成构建…

大型前端项目 DevOps 沉思录 —— CI 篇

摘要 DevOps 一词源于 Development 和 Operations 的组合,即将软件交付过程中开发与测试运维的环节通过工具链打通,并通过自动化的测试与监控,减少团队的时间损耗,更加高效稳定地交付制品. 本篇文章将着重探讨 DevOps 在 持续集成阶段需要提供的能力,将对工作流的设计及流水线的优化思路做一个简要讲解. 随着项目规模越来越大,功能特性与维护人员越来越多,特性交付频率与软件质量之间的矛盾日渐尖锐,如何平衡两者成为了目前团队亟需关注的一个重点,于是,落地一个完善的 DevO…

用gulp构建你的前端项目

前言 前端技术发展日新月异,随着模块化.组件化的提出,前端变得越来越复杂,静态资源越来越多,那么对静态资源的处理,如压缩,合并,去掉调试信息.. 如果还是人工去处理,效率非常之低且还容易出错,于是自动化的处理工具也就必然出现了.就像后端我们一般用maven管理项目,那么前端gulp是个不错的选择. 什么是gulp 是一个基于 Node.js 流.Javascript语法的快速构建前端项目并减少频繁的 IO 操作的自动化工具. Gulp有什么好处 易于学习使用 通过最少的API(核心.src().…

前端项目构建工具---Grunt

什么是Grunt? grunt是javascript项目构建工具,在grunt流行之前,前端项目的构建打包大多数使用ant.(ant具体使用 可以google),但ant对于前端而言,存在不友好,执行效率低,学习成本高的问题.所以最近几年对于前端构建工具--grunt就应运而生. Grunt能做什么呢? 按任务目标大致可分为四类:   1. 文件操作型:比如合并.压缩js和css文件等(包括). 2. 预编译型:比如编译less.sass.coffeescript等. 3. 类库项目构建型:比如…

[front]有效开展一个前端项目

今天的前端如果没有用到 npm,效率是比较低的:所以要从使用的工具来讲. 1. 一切都依赖于 nodejs: 下载一个 linux 的源码包就可以开始安装了. $ wget https://nodejs.org/dist/v4.4.7/node-v4.4.7.tar.gz $ ./configure --prefix=/usr/local/nodejs $ make && sudo make install 装好后,npm 已经在/usr/local/nodejs/bin/npm. 如果之…

gulp 配置前端项目打包

项目发布时,需要对项目js文件进行压缩,混淆,连接等操作以减小项目http请求,加快访问. gulpjs.com中有很多插件可以用来配置打包部署. 需要用的常用插件有: gulp-jsmin  压缩js gulp-minify-css  压缩css gulp-imagemin  压缩图片 gulp-rename  重命名 gulp-clean  清空文件夹 gulp-copy  拷贝引用库,字体等文件 gulp-replace  替换html内容(将原来.js引用改为.min.js引用) 前置过…

项目中用到的SQL-总结

基本sql总结: Group by的理解:having子句,分组函数 Group by使用的限定: 1.出现在Select列表中的字段或者出现在order by后面的字段,如果不是包含在分组函数中,那么该字段必须同时在Group by子句中出现. 2.包含在Group by子句中的字段则不必须出现在在Select列表中. 3.如果没有Group by子句,Select列表中不允许出现字段(单行函数)与分组函数混用的情况 4.不允许在where子句中使用分组函数,用having子句替代 看下面的例…

项目中用到的input 遇到的问题的归类

input 前几天 为了这个词 用在搜索框被我们总监喷,为了加强印象,我把它记录下来 最原始的造型 <input type="text" value="搜索"/> 作成搜索框 比较尴尬,因为鼠标放上去 字居然还在 ,特难受 解决此问题!!!第一中方法 <input type="text" value="搜索" id="sou"/> $("#sou").focus(…

前端项目部署之Grunt

如果你的前端项目很小或都者项目不需要通过专门的运维同学走流水线上线部署的话,那么可以略过以下的繁文. ok,Let's go! 我们看看如何使用grunt来部署上线项目? 前端项目一般分为两种类型:The first,纯静态页面,都是html,类似WebApp(当然也有很多动态页面的WEBAPP): The second,包含一些动态页面,如jsp.php. asp.net 或者是一些别的web服务语言. 由于第二种类型的前端的项目居多,那么我们先从第二种类型的项目上入手,使用grunt来操作项…

Github+yeoman+gulp-angular初始化搭建angularjs前端项目框架

在上篇文章里面我们说到了Github账号的申请与配置 那么当你有了Github账号并创建了一个自己的Github项目之后,首要的当然是搭建自己的项目框架啦! 本人对自己的定位是web前端狗,常用开发框架是angular,所以在这里主要说Github+yeoman+gulp-angular初始化搭建angularjs前端项目框架. 什么是Yeoman? Yeoman是Google的团队和外部贡献者团队合作开发的,他的目标是通过Grunt(一个用于开发任务自动化的命令行工具)和Bower(一个HTM…

使用vue2.x+webpack+vuex+sass+axios+elementUI等快速搭建前端项目框架

一.本文将分享如何快速搭起基于webpack+vue的前端项目框架,利用vue的自己的脚手架工具vue-cli搭建起基本的环境配置,再通过npm包管理工具引入相应的依赖来完善项目的各种依赖框架.下面是具体实操. 二.基本命令操作. 1.在开发之前需要首先安装node.js,直接百度搜索或者在其中文官网也可以下载http://nodejs.cn/download/, 在装完node之后npm包管理工具也自动的安装好,安装完之后,在命令行输入node -v或者npm -v,出现版本号说明安装成功.如…