您要更改的内容位于 iframe 中。我建议您直接将样式表注入 iframe,但不幸的是,您想要的内容位于不同的域中。由于跨域安全策略,您将无法直接修改 iframe 的内容。
有两种方法可以解决这个问题。您可以使用 PHP 应用程序来获取您需要的内容,然后您可以过滤它并以您想要的任何方式更改它。这将替换 iframe,而您只需在页面上显示您需要的内容。另一种选择是使用更简单的 PHP 应用程序来获取内容,但根本不修改它。然后你将你的 iframe 指向这个 PHP 应用程序,它会以与现在相同的方式显示,但它将来自同一个域。然后你可以用 Javascript 注入一个样式表,让它看起来像你想要的任何样子。
“重要!” 如果您使用我提到的第二种方法,可能需要 CSS 覆盖,但这不是问题的根本原因。如果你想了解更多关于如何使用重要!,我推荐这篇文章。
下面我实现了我描述的第一种方法的一个例子。这将下载请求的页面,然后注入一组自定义样式。
<?php
$url = 'http://lema.rae.es/drae/srv/search?id=IwxflJmT9DXX2DMkYs8Z';
$css = <<<EOT
<style type="text/css">
body
{
background: #eeeeee;
}
.a
{
color: green;
}
.f
{
font-size: 200%;
}
.o
{
font-size: 80%;
}
img
{
opacity: .5;
}
img:hover
{
opacity: 1;
}
</style>
EOT;
$data = file_get_contents($url);
$data = str_replace('</head>', $css.'</head>', $data);
echo $data;
?>