Analizador de HTML: herramientas para desarrolladores

Hola codificador,

Este artículo contiene una lista breve con algunos bloques de código escritos en Python sobre la biblioteca BeautifulSoup, que utilicé para procesar y manipular archivos HTML.

Oreja HermosaSopa

# import BS magic
from bs4 import BeautifulSoup as bs, NavigableString, Tag

# load the HTML file
html_file = open('index.html', 'r')
html_content = html_file.read()
html_file.close()

# initialize BS object
# using the html.parser
soup = bs(html_content, 'html.parser')
# At this point, we can interact with the HTML tree, using BS helpers

La biblioteca BeautifulSoup admite más de un analizador (por ejemplo, lxml, xml, html5lib), las diferencias entre ellos se vuelven claras en documentos HTML que no están bien formados. Por ejemplo, lxml agregará etiquetas de cierre faltantes para todos los elementos. Para más información acceda al sección dedicada en la documentación sobre este tema.

Sección de cabeza de análisis

Para seleccionar todo el nodo HEAD e interactuar con todos los elementos, necesitamos escribir solo unas pocas líneas de código:

header = soup.find('head')

# If we want to change the title
header.title.string.replace_with('Updated title') 

Analizar HTML para secuencias de comandos JS

Los archivos Javascript están presentes en el HTML usando nodos de script:

...
<script type="text/javascript" src="https://www.codementor.io/@chirilovadrian360/js/bootstrap.js"></script>
<script type="text/javascript" src="js/custom.js"></script>
...

Para escanear la sopa HTML en busca de etiquetas de script, podemos usar el encuentra todos ayudante:

for script in soup.body.find_all('script', recursive=False):

   # Print the path 
   print(' JS source=" + script[src]) 

   # Update (normalize) the path
   js_path = script["src']
   js_file = js_path.split('/')[-1] # extract the file name
   script[src] = '/assets/js/' + js_file

Analizar HTML para imágenes

for img in soup.body.find_all('img'):

   # Print the path 
   print(' IMG src="https://www.codementor.io/@chirilovadrian360/+ img[src]) 

   img_path = img["src']
   img_file = img_path.split('/')[-1] # extract the file name 
   img[src] = '/assets/img/' + img_file

guardar nuestro trabajo

Todos nuestros cambios se realizan en la memoria. Para hacer que estos cambios sean permanentes, necesitamos extraer la representación de cadena de nuestro HTML procesado de BS y volcarlo en un archivo para su uso posterior:

processed_html = soup.prettify(formatter="html")
f = open( 'index_bs.html', 'w+')
f.write(processed_html)
f.close

A dónde ir desde aquí

Con una API mínima, construida sobre la biblioteca BS, podemos automatizar fácilmente partes pequeñas del proceso de desarrollo web para resolver algunas tareas repetitivas:

  • normalice HTML para alinear fácilmente todos los activos
  • extraer componentes (tarjetas de equipo, características del producto, carruseles) en archivos separados para su uso posterior
  • quitar las cadenas codificadas
  • traducir componentes HTML para que los utilicen otros motores de plantillas: PUG, Jinja2

Aplicaciones de código abierto creadas con HTML Parser

Matraz Bootstrap 5

Volt Dashboard es una fuente gratuita y abierta Arranque 5) plantilla de tablero con más de 100 componentes, 11 páginas de ejemplo y 3 complementos con Vanilla JS. Hay más de 100 componentes gratuitos de Bootstrap 5 incluidos, algunos de ellos son botones, alertas, modales, selectores de fechas, etc.

Flask Bootstrap 5 Volt: proyecto de plantilla proporcionado por AppSeed.


Panel de interfaz de usuario de Flask Soft

Fuente abierta Tablero Django codificado con módulos básicos, base de datos, ORM y scripts de implementación además de Panel de interfaz de usuario suave (versión gratuita), un diseño moderno de Bootstrap 5. Diseñado para aquellos a quienes les gustan los elementos audaces y los sitios web hermosos, Soft UI Dashboard está listo para ayudarlo a crear sitios web y aplicaciones web sorprendentes.

Panel de interfaz de usuario suave: proyecto de plantilla de matraz proporcionado por AppSeed.


Frasco capaz de Datta

Panel de control de código abierto generado por AppSeed en Matraz Estructura. Datta capaz Bootstrap Lite es la plantilla de administración de Bootstrap 4 Lite más estilizada, en comparación con todas las demás plantillas de administración Lite/Free del mercado. Viene con páginas ricas en características y componentes con código totalmente centrado en el desarrollador. Antes de desarrollar Datta Able, nuestros puntos clave eran el rendimiento y el diseño.

Flask Datta Able: proyecto de inicio codificado en Flask.


Por cierto, mi apodo es fumary estoy escribiendo mucho sobre Dev.a
Sm0ke - Fundador de AppSeed.us

Similar Posts

Leave a Reply

Your email address will not be published.