能否通过Python实现HTML页面CSS的实时动态修改？

你要的效果完全可以实现，但Python没法直接操控已加载到浏览器里的CSS——得通过前后端通信让前端主动获取/接收状态，再修改页面样式。结合你的网络扫描器场景，给两个最适合新手的方案：

方案1：轮询API（简单易上手） #

用Python搭个轻量HTTP服务器，前端定时请求服务器拿主机在线状态，再更新页面样式。适合新手，代码量少，容易调试。

步骤&代码示例 #

1. Python后端（扫描+API）
   用Flask搭API，同时异步执行ping扫描：

   from flask import Flask, jsonify
   import asyncio
   from ping3 import ping
   import threading
   
   app = Flask(__name__)
   # 初始化要监控的主机，可根据需求修改
   monitored_hosts = {"192.168.1.1": False, "192.168.1.100": False}
   
   async def check_single_host(host):
       """异步检测单个主机是否在线"""
       try:
           # ping超时1秒，避免阻塞
           return host, ping(host, timeout=1) is not None
       except Exception:
           return host, False
   
   async def periodic_scan():
       """周期性扫描所有主机"""
       while True:
           # 批量创建检测任务
           scan_tasks = [check_single_host(host) for host in monitored_hosts.keys()]
           results = await asyncio.gather(*scan_tasks)
           # 更新状态
           for host, status in results:
               monitored_hosts[host] = status
           # 每5秒扫描一次，可调整间隔
           await asyncio.sleep(5)
   
   @app.route('/host-status')
   def get_host_status():
       """返回主机状态的API接口"""
       return jsonify(monitored_hosts)
   
   if __name__ == '__main__':
       # 启动异步扫描线程，避免阻塞Flask服务器
       scan_thread = threading.Thread(target=lambda: asyncio.run(periodic_scan()), daemon=True)
       scan_thread.start()
       # 启动本地服务器，允许本机访问
       app.run(host='0.0.0.0', port=5000, debug=False)
   

2. 前端HTML（状态展示+更新）
   在你的HTML页面里加一段JavaScript，定时请求API并修改DOM样式：

   <table id="host-status-table">
       <tr>
           <td>网关 (192.168.1.1)</td>
           <td class="status-cell" data-host="192.168.1.1"></td>
       </tr>
       <tr>
           <td>桌面PC (192.168.1.100)</td>
           <td class="status-cell" data-host="192.168.1.100"></td>
       </tr>
   </table>
   
   <script>
       // 定时获取状态并更新页面，间隔和后端扫描一致
       setInterval(async () => {
           try {
               const response = await fetch('http://localhost:5000/host-status');
               const statusData = await response.json();
               
               // 遍历所有状态单元格，更新样式
               document.querySelectorAll('.status-cell').forEach(cell => {
                   const host = cell.dataset.host;
                   const isOnline = statusData[host];
                   // 设置背景色：在线绿，离线红
                   cell.style.backgroundColor = isOnline ? '#2ecc71' : '#e74c3c';
                   cell.textContent = isOnline ? '在线' : '离线';
                   // 可选：加个样式美化
                   cell.style.padding = '4px 12px';
                   cell.style.borderRadius = '4px';
               });
           } catch (err) {
               // 处理请求失败的情况，比如服务器没启动
               console.error('获取状态失败:', err);
           }
       }, 5000);
   </script>
   

方案2：WebSocket实时推送（高效低延迟） #

如果需要状态变化时立刻更新页面，不用等轮询间隔，可以用WebSocket——Python后端扫描到状态变化就主动推给前端，比轮询更高效。

步骤&代码示例 #

1. Python后端（扫描+WebSocket服务器）
   用websockets库实现推送：

   import asyncio
   import websockets
   from ping3 import ping
   import json
   
   monitored_hosts = {"192.168.1.1": False, "192.168.1.100": False}
   
   async def check_single_host(host):
       try:
           return host, ping(host, timeout=1) is not None
       except Exception:
           return host, False
   
   async def scan_and_push(websocket):
       while True:
           scan_tasks = [check_single_host(host) for host in monitored_hosts.keys()]
           results = await asyncio.gather(*scan_tasks)
           has_update = False
           # 检查是否有状态变化
           for host, status in results:
               if monitored_hosts[host] != status:
                   monitored_hosts[host] = status
                   has_update = True
           # 只有状态变化时才推送，减少不必要的通信
           if has_update:
               await websocket.send(json.dumps(monitored_hosts))
           await asyncio.sleep(5)
   
   async def main():
       async with websockets.serve(scan_and_push, "localhost", 8765):
           await asyncio.Future()  # 保持服务器运行
   
   asyncio.run(main())
   

2. 前端HTML（WebSocket接收更新）
   替换轮询的JS为WebSocket代码：

   // 连接本地WebSocket服务器
   const ws = new WebSocket('ws://localhost:8765');
   
   // 接收后端推送的状态
   ws.onmessage = function(event) {
       const statusData = JSON.parse(event.data);
       document.querySelectorAll('.status-cell').forEach(cell => {
           const host = cell.dataset.host;
           const isOnline = statusData[host];
           cell.style.backgroundColor = isOnline ? '#2ecc71' : '#e74c3c';
           cell.textContent = isOnline ? '在线' : '离线';
       });
   };
   
   // 处理连接错误
   ws.onerror = function(error) {
       console.error('WebSocket连接错误:', error);
   };
   

注意事项 #

• 安装依赖：根据用的方案，执行pip install flask ping3（方案1）或pip install websockets ping3（方案2）
• 确保壁纸工具允许页面发起网络请求：大多数桌面壁纸工具支持本地HTTP/WebSocket请求，若遇到跨域问题，可在Python后端加CORS（Flask用flask-cors库）
• 启动顺序：先运行Python后端服务器，再打开设为壁纸的HTML页面
• 异步优化：如果监控的主机数量多，asyncio批量处理比同步ping效率高很多，不会出现卡顿

内容的提问来源于stack exchange，提问作者awado