下面的代码用js给id为main_id元素添加背景色为红色 import sys from PyQt5.QtCore import QUrl from PyQt5.QtWidgets import QMainWindow, QApplication from PyQt5.QtWebEngineWidgets import QWebEngineView
class MainWindow(QMainWindow): def init(self, parent=None): super(MainWindow, self).init(parent) self.init()
def init(self): # 创建QWebEngineView self.webview = QWebEngineView() # 添加HTML内容 html_content = ''' <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="test.js"></script> <title>报表</title> <script> function tprint(){ alert(111) } </script> </head> <body> <div id="main_id" class="middle_panel">1111111111111111111</div> </body> </html> ''' # 在主窗口中加载HTML内容 self.webview.setHtml(html_content) # 在网页加载完成后执行JavaScript代码 def on_load_finished(ok): if ok: script = """ document.getElementById('main_id').insertAdjacentHTML('afterend', '<div>KKKKKKKKKKKKKK</div>'); document.addEventListener('DOMContentLoaded', onDocumentReady); """ self.webview.page().runJavaScript(script) # 将on_load_finished方法连接到页面的loadFinished信号 , 确保完成 self.webview.page().loadFinished.connect(on_load_finished) self.setCentralWidget(self.webview) # 将QWebEngineView添加为主窗口的中央部件
if name == 'main': app = QApplication(sys.argv) # 创建QApplication实例 win = MainWindow() win.show() sys.exit(app.exec_())
抱歉，我无法识别您给出的代码。您提供的是Python语言的代码，但您要求的是使用JavaScript为ID为main_id的元素添加红色背景。以下是您使用的JavaScript代码：
document.getElementById('main_id').style.backgroundColor = 'red';
下面的代码document.getElementById('main_id').style.backgroundColor = 'red';没有生效 import sys from PyQt5.QtCore import QUrl from PyQt5.QtWidgets import QMainWindow, QApplication from PyQt5.QtWebEngineWidgets import QWebEngineView
class MainWindow(QMainWindow): def init(self, parent=None): super(MainWindow, self).init(parent) self.init()
def init(self): # 创建QWebEngineView self.webview = QWebEngineView() # 添加HTML内容 html_content = ''' <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script src="test.js"></script> <title>报表</title> <script> function tprint(){ alert(111) } </script> </head> <body> <div id="main_id" >1111111111111111111</div> </body> </html> ''' # 在主窗口中加载HTML内容 self.webview.setHtml(html_content) # 在网页加载完成后执行JavaScript代码 def on_load_finished(ok): if ok: script = """ document.getElementById('main_id').insertAdjacentHTML('afterend', '<div>KKKKKKKKKKKKKK</div>'); document.addEventListener('DOMContentLoaded', onDocumentReady); document.getElementById('main_id').style.backgroundColor = 'red'; """ self.webview.page().runJavaScript(script) # 将on_load_finished方法连接到页面的loadFinished信号 , 确保完成 self.webview.page().loadFinished.connect(on_load_finished) self.setCentralWidget(self.webview) # 将QWebEngineView添加为主窗口的中央部件
if name == 'main': app = QApplication(sys.argv) # 创建QApplication实例 win = MainWindow() win.show() sys.exit(app.exec_())
您的代码存在一些问题。在加载完成后执行的 JavaScript 代码中，您尝试给元素添加背景颜色但是这段 JavaScript 代码被放在了 document.addEventListener('DOMContentLoaded', onDocumentReady); 后面。这意味着在该事件触发后才会执行添加背景颜色的语句，而实际上您的操作应该在此时已经完成。
为解决这个问题，您可以直接将修改背景颜色的 JavaScript 代码放在 document.getElementById('main_id').insertAdjacentHTML('afterend', '<div>KKKKKKKKKKKKKK</div>'); 之后。这样可以确保在添加新元素后立即设置背景颜色。
如果您需要在页面加载后执行 JavaScript 代码可以使用 on_load_finished 方法中的 runJavaScript 方法。以下是修改后的代码：
def on_load_finished(ok): if ok: script = """ document.getElementById('main_id').insertAdjacentHTML('afterend', '<div>KKKKKKKKKKKKKK</div>'); document.getElementById('main_id').style.backgroundColor = 'red'; """ self.webview.page().runJavaScript(script)
通过这种方式，您应该能够成功为 ID 为 main_id 的元素添加红色背景色了。