在tinymce中使用css个script

tinymce的编辑器中css和script默认是不起作用的。(编辑器主要面向写文章使用,考虑到xss攻击,默认是不启用的)

需要修改tinymce.js中几行代码,可以使其起作用。

1、SaxParser.parse中,关于script标签。

L11732- L11758注释掉

这一部分的意思是,在Start element处遇见script等标签,直接跳过,不进行解析(不追加到DOM中)。

这个函数的调用,一般在editor.setContent中使用(根据传递的HTML string,来对页面的HTML进行设置)。

2、另一个地方就是Schema(L10352)的修改

这一部分是解析模式设置,就是遇见比如div、span等,怎么处理(属性过滤、添加。是不是block,比如span的父节点不是block元素的话,就默认加个p标签等等)。

把L10636(delete schema.script;//不解析script)注释掉。

在L10448中加入‘’script link style‘’,意思是把这些标签解析成block。(你不希望自己的script外面自动加一层p标签)

至此,在code功能中,设置好要显示的内容后,script的功能是加载不进来的。但在preview是能看到css和script效果的。

不同:

code的html设置:elm.html(html);

preview的html设置:

测试部分:

原生的innerHtml是不起作用的,而jquery.html是起作用的。想要起作用,可以使用jquery的方法。

tinymce原装插件源码分析(七)-使能css、script的更多相关文章

  1. tinymce原装插件源码分析(一)-hr

    tinymce简介 tinymce是一款能方便无限扩展的网页富文本编辑器. tinymce原装插件已经十分丰富,对于文本编辑(blog等文章)是绰绰有余,但是应对一些复杂的应用,比如在上面开发html ...

  2. tinymce原装插件源码分析(五)-searchreplace

    searchreplace 功能:查找和替换 代码注释见: https://www.xunhanliu.top/static/js/tinymce/plugins/searchreplace/plug ...

  3. tinymce原装插件源码分析(四)-fullscreen

    fullscreen 作为一款文本编辑器,全屏功能是非常有必要的.在插件中主要是修改一些css style和触发resize事件. style问题(反例): 见github源码:https://git ...

  4. tinymce原装插件源码分析(三)-code

    code: 用于显示源码.主要包含一个弹框.设置显示内容以及内容的更新. function showDialog() { var win = editor.windowManager.open({ t ...

  5. tinymce原装插件源码分析(二)-link

    link 功能描述如下: 单纯放置光标: 1.如果光标放到了<a>上,读取a标签的内容,并弹框显示,确定的时候,更新当前a标签. 2.否则,就创建弹框,确定的时候,按照参数添加a标签. s ...

  6. tinymce原装插件源码分析(六)-preview

    priview 此插件文件结构比较简单,按钮注册.editor.windowManager.open.窗口出现之前的渲染数据的准备.页面代码的准备. 注意: 1.preview的默认宽高设置: 2.c ...

  7. Mybatis源码学习第七天(插件源码分析)

    为了不把开发和源码分析混淆,决定分开写; 接下来分析一下插件的源码,说道这里老套路先说一个设计模式,他就是责任链模式 责任链模式:就是把一件工作分别经过链上的各个节点,让这些节点依次处理这个工作,和装 ...

  8. ABP源码分析七:Setting 以及 Mail

    本文主要说明Setting的实现以及Mail这个功能模块如何使用Setting. 首先区分一下ABP中的Setting和Configuration. Setting一般用于需要通过外部配置文件(或数据 ...

  9. vuex 源码分析(七) module和namespaced 详解

    当项目非常大时,如果所有的状态都集中放到一个对象中,store 对象就有可能变得相当臃肿. 为了解决这个问题,Vuex允许我们将 store 分割成模块(module).每个模块拥有自己的 state ...

随机推荐

  1. 网络教程(2)光纤和RF编码简介

    光纤: 想象一个symbol是light off 另一个是light on 另一种传输信息的方式using radio waves(无线电波: 这个router 内部以很高的频率变换电压 (例如2.4 ...

  2. git入坑随笔

    一直以来,都喜欢用git做版本管理,主要涉及平台是coding, github以及公司自己搭建的gitlab. 因为一直以来都是自己一个人维护前端的项目,所以基本上很少有冲突的情况.(手动微笑 :) ...

  3. 微信公众号开发之获取微信用户的openID

    (注:openID同一用户同一应用唯一,UnionID同一用户不同应用唯一.不同应用指微信开放平台下的不同用户.) 1.  申请测试号(获得appID.appsecret) 2.  填写服务器配置并验 ...

  4. Elasticsearch 入门 - 基本概念

    NRT Elasticsearch 是一个 接近实时 的搜索平台.这意味着从你索引文档到其可以被搜索中间存在着一个轻微的延迟(通常为1秒钟). Cluster 一个或多个节点的完整数据.聚合索引和搜索 ...

  5. Hibernate之HQL基本用法

    关于HQL HQL与SQL非常类似,只不过SQL的操作对象是数据表,列等对象,而HQL操作的是持久化类,实例,属性等. HQL是完全面向对象的查询语言,因此也具有面向对象的继承,多态等特性. 使用HQ ...

  6. 【codeforces 807C】Success Rate

    [题目链接]:http://codeforces.com/contest/807/problem/C [题意] 给你4个数字 x y p q 要求让你求最小的非负整数b; 使得 (x+a)/(y+b) ...

  7. CF55C. Pie or die

    /* CF55C. Pie or die http://codeforces.com/problemset/problem/55/C 博弈论 乱搞 获胜条件是存在一个棋子到边界的值小于5 */ #in ...

  8. poj 2139 flord水题

    读懂题意就简单了 #include<stdio.h> #define inf 999999999 #define N 310 int f[N]; int map[N][N]; int ma ...

  9. POJ 2111

    记忆化搜索即可,设DP[I][J]为可到达的最大步数. 输出时用了一种较笨拙的方法,还有一种方法是使用最长上升子序列的方式,挺好,先排序,这让我想起上次BESTCODER的一题 #include &l ...

  10. 逆向学习XXclient怎样仅仅执行一个实例

    个人觉得学习分两种, 一种是当面请教和直接从书本网络中的资料学习. 其二就是看着令你惊叹的作品-顿悟. 什么?顿悟不了?那我们就一起来逆向学习吧!差点忘了,我并不打算提供Demo,这并不重要,难道你打 ...