javascript - 以编程方式插入 HTML 时，无法为 trix-editor 中的任何标签添加 Id 或 class 等属性

Question

我试图在 trix-editor 中为 span 标签添加 id、class 等属性，同时通过 java 脚本插入 html，但是当我检查该标签的 DOM 时，编辑器从标签中删除了添加的属性。

我的 Java 脚本代码插入带有属性的 html:

element.editor.insertHTML("<span id='" + userId + "' class='mention-user'>" + userName + "</span >"); 

DOM:

 <div><!--block-->@<span style="font-size: 12px;">abc/span></div></trix-editor>

连我都试过了:

element.editor.activateAttribute("href", "https://trix-editor.org/");

这工作正常，但无法添加 id 或 class。任何人都可以在标签中添加 id 或 class 吗？

Answer 1

你可以用不止一种方式使用它

纯 js :

document.getElementsByTagName("span")[0].setAttribute("class", "mention-user");

document.getElementsByTagName("span")[0].setAttribute("id", userId);

或 jquery:

$("span").attr("id",userId);
$("span").attr("class","mention-user");

不知道为什么但是你使用 insertHtml 不知道你是否可以用它添加 id 或 class 希望能回答你的问题