在html文件的指定位置加入指定文本

南锋

发布于 2024-08-07 18:38:31

670

发布于 2024-08-07 18:38:31

文章被收录于专栏：淡忘的博客

记录自己工作中用到的脚本，因为我们的cocosCreator项目导出web项目后，需要修改index.html文件，每次手动修改都很麻烦，而且容易出错，于是决定用脚本来搞定。我这里是用python写的，python版本为3.8

(adsbygoogle = window.adsbygoogle || []).push({});

要在 HTML 文件的指定位置插入指定的文本，可以使用 Python 的 BeautifulSoup 库。

安装库

首先，安装 BeautifulSoup 和 lxml：

pip3 install BeautifulSoup

代码

我这里是在index.html中的<head>和<body>中添加了一些代码。完整代码如下：

from bs4 import BeautifulSoup

def insert_code_in_html(file_path):
    head_code = '''
    <script src="https://telegram.org/js/telegram-web-app.js"></script>
    <style>
        body, html {
            height: 100%;
            margin: 0;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        #GameDiv {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
        }

        #Cocos3dGameContainer {
            width: 100%;
            height: 100%;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        #GameCanvas {
            width: 100%;
            height: 100%;
        }

        #loading-animation {
            display: flex;
            justify-content: center;
            align-items: center;
            position: absolute;
            top: calc(50% - 200px);
            left: 50%;
            transform: translate(-50%, -50%);
        }

        #loading-text {
            display: flex;
            justify-content: center;
            align-items: center;
            color: white;
            font-size: 20px;
            position: absolute;
            top: calc(50% - 80px);
            left: 50%;
            transform: translate(-50%, -50%);
            width: 80%;
            text-align: center;
        }
    </style>
    '''
    body_code = '''
    <div id="loading-animation">
        <img src="web.png" alt="Loading..." style="width: 100%; height: 100%;">
    </div>
    <div id="loading-text">Loading may take a few seconds for the first time. Please be patient.</div>
    <script>
        const tg = window.Telegram.WebApp;
        tg.isClosingConfirmationEnabled = true;
    </script>
    '''

    # 读取 HTML 文件内容
    with open(file_path, 'r', encoding='utf-8') as file:
        soup = BeautifulSoup(file, 'lxml')

    # 在 <head> 中插入代码
    if soup.head:
        soup.head.append(BeautifulSoup(head_code, 'html.parser'))
    else:
        print("<head> 标签未找到。")

    # 在 <body> 中插入代码
    if soup.body:
        soup.body.append(BeautifulSoup(body_code, 'html.parser'))
    else:
        print("<body> 标签未找到。")

    # 将修改后的 HTML 写回文件
    with open(file_path, 'w', encoding='utf-8') as file:
        file.write(str(soup))

# 示例用法
file_path = 'web-mobile/index.html'
insert_code_in_html(file_path)

由于自己太懒，连代码都不想运行，于是乎，直接将上面python脚本导出了一个.exe可执行文件，每次只要双击改执行文件就行了。

踩坑

运行的时候报下面错：

Traceback (most recent call last):
  File ".\html.py", line 1, in <module>
    from bs4 import BeautifulSoup
  File "C:\Users\84267\AppData\Roaming\Python\Python38\site-packages\bs4\__init__.py", line 37, in <module>
    from .builder import (
  File "C:\Users\84267\AppData\Roaming\Python\Python38\site-packages\bs4\builder\__init__.py", line 9, in <module>
    from bs4.element import (
  File "C:\Users\84267\AppData\Roaming\Python\Python38\site-packages\bs4\element.py", line 13, in <module>
    from bs4.formatter import (
  File "C:\Users\84267\AppData\Roaming\Python\Python38\site-packages\bs4\formatter.py", line 1, in <module>
    from bs4.dammit import EntitySubstitution
  File "C:\Users\84267\AppData\Roaming\Python\Python38\site-packages\bs4\dammit.py", line 12, in <module>
    from html.entities import codepoint2name
  File "E:\Project_D_tg\build\html.py", line 1, in <module>
    from bs4 import BeautifulSoup
ImportError: cannot import name 'BeautifulSoup' from partially initialized module 'bs4' (most likely due to a circular import) (C:\Users\84267\AppData\Roaming\Python\Python38\site-packages\bs4\__init__.py)

如下图：