文档地址:

https://www.layui.com/demo/code.html

基本案例:

<pre class="layui-code">//在里面存放任意的代码
Lay.fn.event = function(modName, events, params){
var that = this, result = null, filter = events.match(/\(.*\)$/)||[];
var set = (events = modName + '.'+ events).replace(filter, '');
};
</pre> <script>
layui.use('code', function(){
//layui.code(); 实际使用时,执行该方法即可。而此处注释是因为修饰器在别的js中已经执行过了
layui.code();
});
</script>

相关属性:

默认选中的是类属性layui-code

也可以指定pre标签名称

layui.code({
elem: 'pre' //默认值为.layui-code
});

设置修饰器的标题:

title: 'JavaScript'

设置修饰器的高度:

height: '100px' //请注意必须加px。如果该key不设定,则会自适应高度,且不会出现滚动条。

设置HTML转义处理:

需要在pre标签中展现html标签,而不希望它被浏览器解析。那么code模块允许你这么做,只需要开启encode即可

encode: true //是否转义html标签。默认不开启

NotePad风格:

skin: 'notepad' //如果要默认风格,不用设定该key。

删除右上角的引用:

about: false

【Layui】14 代码修饰器 CodeDecorator的更多相关文章

  1. layui.code代码装饰器

    <!doctype html><html lang="en"><head> <meta charset="UTF-8" ...

  2. Python修饰器

    Python的修饰器的英文名叫Decorator,当你看到这个英文名的时候,你可能会把其跟Design Pattern里的Decorator搞混了,其实这是完全不同的两个东西.虽然好像,他们要干的事都 ...

  3. Python 从零学起(纯基础) 笔记 之 迭代器、生成器和修饰器

    Python的迭代器. 生成器和修饰器 1. 迭代器是访问集合元素的一种方式,从第一个到最后,只许前进不许后退. 优点:不要求事先准备好整个迭代过程中的所有元素,仅仅在迭代到某个元素时才计算该元素,而 ...

  4. Python修饰器的函数式编程

    Python的修饰器的英文名叫Decorator,当你看到这个英文名的时候,你可能会把其跟Design Pattern里的Decorator搞混了,其实这是完全不同的两个东西.虽然好像,他们要干的事都 ...

  5. 修饰器模式(day04)

    修饰器设计模式 --最近我给女朋友买了一款可以更换外壳的手机.现在的外壳是红色的,假如我想用这款手机的时候,会更换成银灰色的外壳.但是我不能随意更换天线或者话筒,因为这些功能模块在手机生产的时候就已经 ...

  6. ES2017中的修饰器Decorator

    前面的话 修饰器(Decorator)是一个函数,用来修改类的行为.本文将详细介绍ES2017中的修饰器Decorator 概述 ES2017 引入了这项功能,目前 Babel 转码器已经支持Deco ...

  7. ES6(Decorator(修饰器))

    Decorator(修饰器) 1.基本概念 函数用来修改 类 的行为 1.Decorator 是一个函数 2.通过Decorator(修饰器)能修改 类 的行为(扩展 类 的功能)3.Decorato ...

  8. Python_@修饰器(装饰器)的理解

    装饰器本质上是一个Python函数,它可以让其他函数在不需要做任何代码变动的前提下增加额外功能. 装饰器的作用就是为已经存在的对象添加额外的功能. def funA(fun): print (fun( ...

  9. decorator(修饰器)的业务应用

    decrator(修饰器)的业务应用 ES6问世的时间也不短了,而且很多时候对ES6所谓的"熟练应用"基本还停留在下面的几种api应用: const/let 箭头函数 Promis ...

  10. Smarty 变量修饰器

    为了更方便的实现 功能与显示分离,通常会用 smarty 将功能代码中的数据 assign 到页面中,在页面中合理使用 smarty 的修饰方法,会使页面显示更美观! 一个数据可同时使用多个修饰函数, ...

随机推荐

  1. [SWPUCTF 2021 新生赛]easy_md5

    打开靶场可以看到一串代码,进行代码审计我们可以知道这个网页包含了一个叫flag2.php的文件,如果想要得到这个文件就得进行GET传参和POST传参. 并且这里用到一个MD5绕过,传参的值不能相等,但 ...

  2. OpenSearch 与 Elasticsearch:哪个开源搜索引擎适合您?

    当谈论到搜索引擎产品时,Elasticsearch 和 OpenSearch 是两个备受关注的选择.它们都以其出色的功能和灵活性而闻名,但在一些方面存在一些差异.在本文中,我们将从功能和延展性.工具与 ...

  3. maven和gradle环境变量配置及idea相关的设置

    1.maven 环境变量添加之后,重新打开cmd窗口,验证是否配置成功. idea   File >> Settings idea配置之后的验证: 2.gradle 环境变量添加之后,重新 ...

  4. vue目录文件结构

    my-vue-app/ ├── node_modules/ # 依赖的第三方模块 ├── public/ # 公共文件,不会被打包 │ ├── index.html # 应用的入口 HTML 文件 │ ...

  5. FFmpeg变速处理视频文件

    使用工具:小丸工具箱,HandBrake,FFmpeg 首先确定视频是否为VFR(可变帧率),如果是VFR需要在二次处理前转换成CFR(固定帧率) VFR转换CFR可以使用FFmpeg命令行或Hand ...

  6. HCIA基本命令

    ACLDHCPNATSTP-RSTP-MSTPVLANVLAN间路由VRRP链路聚合路由

  7. logo2

  8. 【Mysql】 MysqlDump导表结构或数据

    mysqldump只导出表结构或只导出数据的实现方法 语法: 默认不带参数的导出,导出文本内容大概如下:创建数据库判断语句-删除表-创建表-锁表-禁用索引-插入数据-启用索引-解锁表. Usage: ...

  9. 两张图带你全面了解React状态管理库:zustand和jotai

    zustand 和 jotai 是当下比较流行的react状态管理库.其都有着轻量.方便使用,和react hooks能够很好的搭配,并且性能方面,对比React自身提供的context要好得多,因此 ...

  10. jQuery -- 手稿