在 jQuery 文本区域中编辑 Div 内容

Editing Div content within jQuery textarea

本文关键字：编辑 Div 内容 区域 jQuery 文本      更新时间：2023-09-26

我正在使用Dmxzones高级HTML编辑器3，它插入了以下代码：

<textarea id="advHTMLEdit1" name="advHTMLEdit1" class="dmxEditor" style="width:700px;height:300px"></textarea>
 jQuery(document).ready(
   function()
     {
       jQuery("#advHTMLEdit1").dmxEditor(
         {"width": 700, "lineBreak": "p", "allowUpload": true, "uploadPath": "tmp", "subFolder": "1", "uploadProcessor": "php", "allowResize": true, "includeCss": "tutorial.css", "skin": "blue"
       );
     }
 );

它使用 javascript execCommand（） 插入元素，并将类样式应用于这些元素。

与： jQuery("#advHTMLEdit1")[0]

我似乎能够访问它，但我尝试过的任何东西都无法让我访问子节点。我希望能够遍历编辑器创建的每个子节点，查询类，如果它是特定的类名，则替换该元素上的 HTML。

我不使用 jQuery，虽然我自己尝试了很多东西，但我似乎无法访问编辑器创建的任何元素。

借用

这个答案并根据您提供的链接，您应该执行以下操作：

如果要对所有匹配的类应用一致的css：

var ifrm = $("#advHTMLEdit1").prev(".dmx-editor-frame-wrapper").find("iframe")[0];
ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;
ifrm = $(ifrm.document);
ifrm.find(".yourClass").css("cssProperty", "cssValue");

如果要对所有元素应用不同的css：

var ifrm = $("#advHTMLEdit1").prev(".dmx-editor-frame-wrapper").find("iframe")[0];
ifrm = (ifrm.contentWindow) ? ifrm.contentWindow : (ifrm.contentDocument.document) ? ifrm.contentDocument.document : ifrm.contentDocument;
ifrm = $(ifrm.document);
var elem;
ifrm.find("body *").each(function(){
    elem = $(this);        
    if(elem.hasClass("yourClass") && elem.is("span")) {
        //elem.css("cssProperty", "cssValue");                
        elem.text("new text");
    }
});

如果你想改变具有某个类的所有跨度的文本，你可以用更短的代码执行以下操作，不需要循环：

ifrm.find("span.myClass").text("new text");

仅当span的新文本取决于class名称时，才使用第二个示例。

编辑：根据您在页面中提供的示例，您可以编写：

ifrm.find("p.codeblock").text("new text");
相关文章：