使用 Python 格式化内联 CSS

Question

我有一个 HTML 文件，其中包含以下代码：

<...some tags...>
<textarea id="123" attributeX="4" attributeY="5" style="width:159px; height:50px; other styles;">
<textarea id="456" attributeX="4" attributeY="5" style="width:135px; height:50px; other styles;">
<textarea id="789" attributeX="4" attributeY="5" style="width:177px; height:50px; other styles;">
<...some other tags...>

我想通过使用 Python 2.0 将所有文本区域的宽度更改为 200px。我的第一个想法是使用 BeautifulSoup，我发现了这个代码片段：

from bs4 import BeautifulSoup
from cssutils import parseStyle

html = '<td style="font-size: .8em; font-family: monospace; background-color: rgb(244, 244, 244);"></td>'

soup = BeautifulSoup(html, 'html.parser')
style = parseStyle(soup.td['style'])
style['background-color'] = 'red'
soup.td['style'] = style.cssText
print(soup.td)

不幸的是，这只会更改 one 标签的样式。我想更改 all textarea 标签

我尝试了以下代码：

from bs4 import BeautifulSoup
from cssutils import parseStyle

soup = BeautifulSoup(sHTML,'html.parser')
for txt in soupfindAll('textarea'):
   style = parseStyle(text.textarea['style'])
   style['width'] = '200px'
   txt.textarea['style'] = style.cssText

这会在“style = ...”行上生成“NoneType 对象不可订阅”错误

有人知道我如何执行所需的格式化吗？

谢谢

Answer 1

尝试以下方法：

from bs4 import BeautifulSoup
from cssutils import parseStyle

with open('input.html') as f_html:
    soup = BeautifulSoup(f_html, 'html.parser')
    
for textarea in soup.find_all('textarea', style=True):
    style = parseStyle(textarea['style'])
    style['width'] = '200px'
    textarea['style'] = style.cssText.replace('\n', ' ')

with open('output.html', 'w', encoding='utf-8') as f_html:
    f_html.write(str(soup))

因此，如果您的 HTML 是：

<html>
<body>
<textarea id="123" attributeX="4" attributeY="5" style="width:159px; height:50px;"></textarea>
<textarea id="456" attributeX="4" attributeY="5" style="width:135px; height:50px;"></textarea>
<textarea id="789" attributeX="4" attributeY="5" style="width:177px; height:50px;"></textarea>
<textarea id="789" attributeX="4" attributeY="5"></textarea>
</body>
</html>

输出将变为：

<html>
<body>
<textarea attributex="4" attributey="5" id="123" style="width: 200px; height: 50px"></textarea>
<textarea attributex="4" attributey="5" id="456" style="width: 200px; height: 50px"></textarea>
<textarea attributex="4" attributey="5" id="789" style="width: 200px; height: 50px"></textarea>
<textarea attributex="4" attributey="5" id="789"></textarea></body>
</html>

这里最后的<textarea>没变，因为没有样式。如果需要，可以按如下方式添加：

from bs4 import BeautifulSoup
from cssutils import parseStyle

with open('input.html') as f_html:
    soup = BeautifulSoup(f_html, 'html.parser')
    
for textarea in soup.find_all('textarea'):
    if 'style' in textarea.attrs:
        # Update existing style
        style = parseStyle(textarea['style'])
        style['width'] = '200px'
        textarea['style'] = style.cssText.replace('\n', ' ')
    else:
        # Add missing style
        textarea['style'] = 'width: 200px; height: 50px'

with open('output.html', 'w', encoding='utf-8') as f_html:
    f_html.write(str(soup))

使用 Python 格式化内联 CSS

Format inline CSS with Python

html

css

python

beautifulsoup