Question

我有一个弹出窗口，我想将单独文件中的CSS应用于此窗口。

我还需要从弹出窗口的输入中读取用户输入，并将其应用于非弹出窗口部分。

这是我到目前为止所拥有的

  popout = () => {
    let doc = window.open('', '', 'width=1200,height=800').document;
    doc.open();
    doc.write(document.getElementById("test").outerHTML);
    doc.close();
  }

https://jsfiddle.net/v3pdzLka/13/

对于这种小提琴，我希望将按钮的颜色转移到弹出窗口，以及将弹出窗口的输入写到原始输入。

这可能吗？

Answer 1

有3种方法。

let doc = window.open('', '', 'width=1200,height=800').document;
doc.open();
doc.write(`<p>big butt so what</p>`);

// style property
doc.body.style.background = 'purple';

// inline styles
var styles = doc.createElement('style');
styles.appendChild(doc.createTextNode(`
  p{ color: green; }
`));
doc.head.appendChild(styles);

// stylesheet
var link = doc.createElement('link');
link.setAttribute('rel', 'stylesheet');
link.setAttribute('href', 'mystylesheet.css');
doc.head.appendChild(link);

doc.close();

分叉的小提琴：https://jsfiddle.net/fyugnj91/

如何从CSS读取输入值/将CSS应用于弹出窗口

1 个答案: