使用javascript从iframe更改父字体

我有一个来自第三方实时聊天提供商（Tidio chat）的iframe，我想更改其中所有文本的字体：

下面是我正在使用的代码，它运行良好：

document.getElementById("tidio-chat-iframe").contentDocument.body.style.fontFamily = "Tahoma";

问题是我想使用我自己的字体，这些字体位于父级并可从父级访问，因此我使用了以下字体：

document.getElementById("tidio-chat-iframe").contentDocument.body.style.fontFamily = "Lalezar";

但是由于iframe页面没有从父页面继承任何CSS，因此我还需要在iframe页面中包含字体的样式表

问题是当我们使用通过脚本包含在页面中的第三方iframe时，我们不能这样做

我的意思是，如果我自己创建了iframe，我显然可以将字体导入其中，但现在

如何使用javascript从iframe使用父字体

---

请不要将此问题标记为重复。。。关于堆栈溢出没有类似的问题

下面的代码片段是一个示例，说明了父级如何注入/更改iframe的css

window.onload = function() {
   let myiFrame = document.getElementById("myiFrame");
   let doc = myiFrame.contentDocument;
   doc.body.innerHTML = doc.body.innerHTML + '<style>/******* Put your styles here *******</style>';
}

---

请参阅-

我们可以简单地更改样式，但iframe无法访问父字体，因此无法正常工作。请参阅此选项，正确地插入样式，但会发生扭曲。原因是什么

doc.body.innerHTML=doc.body.innerHTML+'@font-face{font-family:IRANSansWeb；src:url（fonts/iransweb.woff）格式（“woff”）}
window.onload = function() {
  let link = document.createElement("link");
  link.href = "style.css";      /**** your CSS file ****/ 
  link.rel = "stylesheet"; 
  link.type = "text/css"; 
  frames[0].document.head.appendChild(link); /**** 0 is an index of your iframe ****/ 
}