提问人：Pekka 提问时间：12/4/2009 最后编辑：Pekka 更新时间：2/14/2015 访问量：23796
CKEditor：编辑器主体的类或 ID
CKEditor: Class or ID for editor body
问：
我的页面上有一个 CKEditor 实例。我正在尝试为 CKEditor 的主体提供一个类或 ID，以便它与我在样式表中定义的一些样式相匹配。
有一个 API 文档应该可以访问相应的 DOM 元素，但我似乎无法让它工作。我尝试以这种方式查询的所有对象都未定义。
有没有人知道如何做到这一点，或者如何正确处理 CKEditor 的 dom 元素？
编辑：谢谢大家，nemisj 的答案为我做到了，但由于某种原因，我无法在这个问题中设置“已接受”复选标记。
答：
0赞
yoda
12/4/2009
#1
不知道那个编辑器，但由于它们都以相同的方式工作，您可能无法访问实例创建的 DOM 元素，因为它们是在页面完成加载后创建的，并且 DOM 也已准备就绪。因此，在此之后添加的任何新 DOM 元素，理论上都不会存在。
不过，您可以尝试 TinyMCE 编辑器，它与 jQuery javascript 库建立了“合作伙伴关系”，可以操作您想要的所有内容，并且编辑器本身几乎在各个方面都很容易更改。
评论
0赞
Pekka
12/4/2009
干杯，但我对 TinyMCE、CKEditor 和其他几个人进行了长时间的比较，并将自己（和客户）承诺给 CKEditor，所以在这种情况下，我需要关于该特定产品的具体建议。
0赞
yoda
12/4/2009
好吧，在这种情况下，我只能考虑使用 jQuery 来监听 DOM 并更改您需要的任何内容。检查 jQuery 文档中的 listen（） 函数，应该会给你灯光。
11赞
nemisj
12/8/2009
#2
如果你说的是 CKEditor（版本 3），那么有可能在编辑器本身中获取任何 DOM 实例。每个 CKEditor 实例都通过“document”属性引用其文档。
var documentWrapper = edit.document;
此引用表示所有 CKEditor 节点的一些公共包装器，但它也具有对其节点的直接引用。您可以通过获取 [“$”] 属性进行检索。
var documentNode = documentWrapper.$; // or documentWrapper['$'] ;
documentNode 将表示 iframe 中文档节点的 DOM 实例。有了 DOM 实例后，你可以对 DOM 结构做任何你想做的事情，追加、删除、替换类、重建等。例如
documentNode.body.className = "zork";
我希望这应该足够了。
评论
0赞
nemisj
12/10/2009
edit - 是 CKEditor 的实例，如果您使用 replace 函数创建。
0赞
Pekka
12/16/2009
@nemisj，我一定是让赏金过去了，也许认为你的答案无论如何都会被自动接受。但显然，要自动接受，必须有两个或更多赞成票在场，现在我什至无法以正常方式接受它。不好意思！！
2赞
Sampson
12/16/2009
#3
从手册中：
<static> {String|Array} CKEDITOR.config.contentsCss
用于将样式应用于内容的 CSS 文件。它应该反映在使用内容的最后页面中使用的 CSS。
config.contentsCss = '/css/mysitestyles.css';
config.contentsCss = ['/css/mysitestyles.css', '/css/anotherfile.css'];
默认值：
<CKEditor folder>/contents.css
评论
0赞
Pekka
12/16/2009
干杯 Jonathan，但在我的情况下，我有一个仅适用于某个类名称的正文的样式表，这就是为什么我需要专门设置正文类的原因。
0赞
Upperstage
12/16/2009
#4
您的查询可能会返回 undefined，因为编辑器实例放置在 iFrame 中，而您的查询未在此处查找？
14赞
AlfonsoML
5/18/2010
#5
尽管在提出此问题时，API 的这一部分不是从 2.x 移植而来的，但现在使用 bodyId 和 bodyClass 配置选项更容易了。
当然，nemisj 的解释很好，可以用于其他事情，但您必须记住，每次从设计（切换到源视图）时，iframe 都会被破坏，因此如果您手动执行此操作，则需要重新分配属性。
3赞
Mark Landson
7/14/2010
#6
我今天在尝试像这样设置bodyClass时遇到了同样的问题：
CKEDITOR.replace（ 'editor1'， { fullPage ： 真， bodyClass ： '我的类'
});
我发现在这个版本（3.3.1）中，如果你设置fullpage = true，设置bodyId或bodyClass不起作用，但如果你设置fullPage = false，它确实有效。
希望这会有所帮助。
0赞
Abhinav Srivastav
1/19/2014
#7
在 config.js 中，编写以下代码
config.bodyId = 'contents_id';
然后你在 Ckeditor 中看到正文 ID，但当你想访问这个 ID 时，请使用
$('#parent_id').find('iframe').contents().find('#within_iframe')
有手段或任何父级，这是访问 iframe 的简单方式。按照以下代码访问 iframe 中的元素$('#parent_id')form_id
评论