Cómo manipular el DOM usando PHP

Cuando se trata de manipular el DOM, lo primero que pensamos muchos de nosotros es usar JavaScript para hacer lo que sea que necesitemos hacer.

El lenguaje no solo admite de forma nativa funciones para hacer esto, sino que las características más nuevas de ES6 nos brindan formas más poderosas de crear scripts del lado del cliente. Y si usa jQuery con WordPress, entonces tiene la misma biblioteca de funciones para, ejem, consultar el DOM que hemos tenido durante años.

Pero manipular el DOM en el lado del cliente no siempre es la mejor opción. En su lugar, es posible que desee hacerlo en el lado del servidor. Y debido a algunas de las funciones integradas en PHP, no es muy diferente de cómo hacemos las cosas con JavaScript.

Además, por supuesto, lo estamos haciendo en el servidor.

Entonces, si alguna vez trabaja con el contenido de una publicación (un tipo de publicación o un tipo de publicación personalizada, para el caso) y necesita manipular etiquetas como lo haría con JavaScript, entonces usar la DomDocumentbiblioteca es uno de los más poderosos Las herramientas están a tu disposición.

Digamos, por ejemplo, que desea recorrer todos los elementos de párrafo que existen en el contenido de la publicación.

Es fácil hacer esto usando dicha biblioteca. Primero, querrá asegurarse de tener la biblioteca configurada en su clase (o solo en su colección de funciones):

A continuación, configure un gancho para el contenido:

<?php

add_filter('the_content', __NAMESPACE__. 'updateParagraphElements');

Y dentro de esa función, asegúrese de cargar el contenido de la publicación en la biblioteca y luego busque todos los pelementos como lo haría con JavaScript (con una nota importante que necesita para codificar correctamente la información en caso de superíndices o emojis). usó):

<?php

function updateParagraphElements($content) 
{
    /* If we're not on a single page or it's not the main query, 
     * we won't do anything.
     */
    if (!is_single() || !is_main_query()) {
        return $content;
    }

    // Make sure there is content to parse (and properly encode the HTML entities).
    $domDocument = new DOMDocument();
    $domContent = $domDocument->loadHTML(mb_convert_encoding($content, 'HTML-ENTITIES'));
    if (false === $domContent) {
        return $content;
    }

    $paragraphs = $domDocument->getElementsByTagName('p');
    if (0 === count($paragraphs)) {
        return $content;
    }

    // More to come...
}

Desde aquí, puede hacer varias cosas diferentes, como agregar la ID de la publicación a un atributo personalizado de cada elemento de párrafo. La función completa se vería así:

<?php

namespace Acme;

use DOMDocument;

add_filter('the_content', __NAMESPACE__. 'updateParagraphElements');
/**
 * Updates the content by locating all of the `p` elements in the content,
 * then adds a class attribute of the post ID to them.
 *
 * The gist of the work is done in this function.
 *
 * @param string $content the post content
 *
 * @return string the updated post content with the aforemented markup.
 */
function updateParagraphElements($content) 
{
    /* If we're not on a single page or it's not the main query, 
     * we won't do anything.
     */
    if (!is_single() || !is_main_query()) {
        return $content;
    }

    // Make sure there is content to parse (and properly encode the HTML entities).
    $domDocument = new DOMDocument();
    $domContent = $domDocument->loadHTML(mb_convert_encoding($content, 'HTML-ENTITIES'));
    if (false === $domContent) {
        return $content;
    }

    $paragraphs = $domDocument->getElementsByTagName('p');
    if (0 === count($paragraphs)) {
        return $content;
    }

    // If so, iterate through the elements and add the post ID as a custom attribute.
    $updatedContent = '';
    foreach ($paragraphs as $paragraph) {
        $paragraph->setAttribute('data-id', get_the_ID());
    }

    return wp_kses_post($domDocument->saveHTML());
}

Por supuesto, también hay otras cosas que puedes hacer. Una cosa es manipular el marcado antes de enviarlo al navegador. Sin embargo, otra cosa es agregar atributos a los datos si aún no existen.

Eso es, sin juego de palabras, excepto tal vez solo una especie de contenido para otra publicación.