前端页面使用ace插件优化脚本
html页面:<pre id="editor" style="width: 100%;height: 800px;"></pre>(注:必须设置高度)
function getScriptHightLight(){
ace.config.set("basePath", "vendors/ace-build/src-min");
ace.require("ace/ext/beautify");
var editor = ace.edit("editor");
if($scope.store&&$scope.store.scriptContent){
editor.setValue($scope.store.scriptContent); //设置内容
if($scope.oper==="detail"){
editor.setReadOnly(true); //只读
}else{
editor.setReadOnly(false); //只读
}
}else{
editor.setValue('');//没有值设置为空
}
editor.setOption("wrap", "free") //自动换行
editor.setShowPrintMargin(false); //设置打印线
editor.session.setMode("ace/mode/sh");
editor.setTheme("ace/theme/vibrant_ink"); //引入的模板
editor.setHighlightActiveLine(true); //设置高亮
editor.setOptions({
enableBasicAutocompletion: true,
enableSnippets: true,
enableLiveAutocompletion: true
});
editor.on('change', function () {//更新脚本事件
$timeout(function () {
$scope.$apply(function () {
var value = editor.getValue();
$scope.store.scriptContent=value;
});
});
});
}
前端页面使用ace插件优化脚本的更多相关文章
- JS基础——浅谈前端页面渲染和性能优化
加载html中的静态资源 其中,加载静态资源的过程,一般为浏览器根据DNS服务器得到域名的IP地址,然后向这个IP的机器发送http请求,服务器收到.处理并返回http请求,浏览器得到返回http请求 ...
- 前端页面加载速度优化---Ngnix之GZIP压缩
gzip on; #开启Gzip gzip_static on;#是否开启gzip静态资源 #nginx对于静态文件的处理模块,该模块可以读取预先压缩的gz文件,这样可以减少每次请求进行gzip压缩的 ...
- web前端页面性能优化
影响用户访问的最大部分是前端的页面.网站的划分一般为二:前端和后台.我们可以理解成后台是用来实现网站的功能的,比如:实现用户注册,用户能够为文章发表评论等等.而前端呢?其实应该是属于功能的表现. 而我 ...
- web前端页面性能优化小结
影响用户访问的最大部分是前端的页面.网站的划分一般为二:前端和后台.我们可以理解成后台是用来实现网站的功能的,比如:实现用户注册,用户能够为文章发表评论等等.而前端呢?其实应该是属于功能的表现. 而我 ...
- 前端页面卡顿?或是DOM操作惹的祸,需优化代码
文档对象模型(DOM)是一个独立 于特定语言的应用程序接口.在浏览器中,DOM接口是以JavaScript语言实现的,通过JavaScript来操作浏览器页面中的元素,这使得 DOM成为了JavaSc ...
- Web前端开发最佳实践(13):前端页面卡顿?可能是DOM操作惹的祸,你需要优化代码
文档对象模型(DOM)是一个独立于特定语言的应用程序接口.在浏览器中,DOM接口是以JavaScript语言实现的,通过JavaScript来操作浏览器页面中的元素,这使得DOM成为了JavaScri ...
- web前端页面优化——个人见解
web前端页面优化,我们从JavaScript.css.html这3个方面说下,我的见解,希望大神们能有刚好优化方法,一起探讨. 一. 有关javascript方面 优化见解. 1. 首先举个例子: ...
- 前端Yslow的23个优化原则
前端Yslow的23个优化原则 最常遇见的前端优化问题. Yslow是雅虎开发的基于网页性能分析浏览器插件,可以检测出网页的具体性能值,并且有著名的Yslow 23条优化规则,这23条,就够我们玩的了 ...
- Django实战(一)-----用户登录与注册系统3(前端页面、登录视图)
基本框架搭建好了后,我们就要开始丰富页面内容了.最起码,得有一个用户登录的表单不是么?(注册的事情我们先放一边.) 一. 原生HTML页面 删除原来的login.html文件中的内容,写入下面的代码: ...
随机推荐
- C. Jury Marks
C. Jury Marks time limit per test 2 seconds memory limit per test 256 megabytes input standard input ...
- Web Service 之JAX-WS 与CXF实现
Web Service的实现方式有很多种,本篇介绍的是基于JAX-WS(纯Java)实现的,然后借由CXF工具生成Javabean. 第一步:创建一个Java工程,编写CalService接口,此接口 ...
- 分享几个高效编写JS 的心得
原则 不要做任何优化除非的确需要优化 任何的性能优化都必须以测量数据为基础,如果你怀疑代码存在性能问题,首先通过测试来验证你的想法.性能优化三问 我还能做哪些工作从而让代码变得更有效率? 流行的J ...
- 搭建 Http Dynamic Streaming 点播/直播服务器
1. HTTP Origin Module的处理数据流: a) 客户端发送媒体索引请求到Apache.例如: http://www.example.com/media/ ...
- ACM学习历程—Hihocoder 1288 Font Size(暴力 || 二分)
http://hihocoder.com/problemset/problem/1288 这题是这次微软笔试的第一题,关键的是s的上限是min(w, h),这样s的范围只有到1000,这样就可以直接暴 ...
- Nginx正则表达式之匹配操作符详解
nginx可以在配置文件中对某些内置变量进行判断,从而实现某些功能.例如:防止rewrite.盗链.对静态资源设置缓存以及浏览器限制等等.由于nginx配置中有if指令,但是没有对应else指令,所以 ...
- UDK编辑器 49条小提示
转自:http://www.cnblogs.com/hmxp8/archive/2012/02/09/2343674.html Very Helpful~ 01. First time using t ...
- Python-Redis的String操作
Ubuntu安装Redis sch01ar@ubuntu:~$ sudo apt install redis-server sch01ar@ubuntu:~$ redis-server sch01ar ...
- Java接口定义和实现
1. 使用interface来定义一个接口.接口定义类似类的定义,分为接口的声明和接口体,其中接口体由常量定义和方法定义两部分组成.定义接口的基本格式如下: [修饰符] interface 接口名 [ ...
- centos 7之文件共享
一,安装过程 1.在VirtualBox的软件菜单里面选择 “设备”--“存储”,添加VBoxGuestAdditions.iso(在VirtualBox目录下). 2.在桌面上出现一个光驱 ...