Eu preciso escrever um personalizado Gole tarefa que irá remover atributos do meu HTML

Question 1

Estou precisando de um Gole tarefa que vai percorrer todas atribuído documentos HTML e remover determinados atributos (tais como a style=""). Eu pensei que talvez eu tenha sido capaz de fazê-lo da mesma forma que eu fazê-lo através do browser, mas parece que não. Aqui está o que eu estou tentando fazer:

// function to take multiple attributes from an element
const discardAttributes = (element, ...attributes) =>
  attributes.forEach((attribute) => element.removeAttribute(attribute));

// run the function on multiple elements
document.querySelectorAll("table, thead, tbody, tr, th, td").forEach((elem) => {
  discardAttributes(elem, "cellspacing", "cellpadding", "width", "style");
});

Eu gostaria de, em seguida, tomar a fórmula acima e criar um gole.tarefas como:

const gulp = require("gulp");

gulp.task("clean",  async () => {
 gulp.src("src/*.html")
  .pipe(discardAttributes())
    .pipe(gulp.dest("dist"));
});

Se existe um plug-in que eu possa usar que vai fazer isso, por favor compartilhar, mas também, eu gostaria de saber como fazê-lo manualmente como este.

Seria preciso usar through2?

Obrigado.

Question 2

Você pode usar alguns nó dom biblioteca, e envolvê-lo com um gole. Por exemplo, você poderia tentar jsdom e o wrapper gole-dom:

const gulp = require('gulp');
const dom = require("gulp-dom");

gulp.task("default", async () => {
 gulp.src("src/*.html")
  .pipe(dom(function() {

      // function to take multiple attributes from an element
      const discardAttributes = (element, ...attributes) =>
        attributes.forEach((attribute) => element.removeAttribute(attribute));

      // run the function on multiple elements
      return this.querySelectorAll("table, thead, tbody, tr, th, td").forEach((elem) => {
       discardAttributes(elem, "cellspacing", "cellpadding", "width", "style");
    });

  }))
  .pipe(gulp.dest("dist"));
});

Nikolay · Answer 1 · 2021-11-21T17:18:21

Você pode usar alguns nó dom biblioteca, e envolvê-lo com um gole. Por exemplo, você poderia tentar jsdom e o wrapper gole-dom:

const gulp = require('gulp');
const dom = require("gulp-dom");

gulp.task("default", async () => {
 gulp.src("src/*.html")
  .pipe(dom(function() {

      // function to take multiple attributes from an element
      const discardAttributes = (element, ...attributes) =>
        attributes.forEach((attribute) => element.removeAttribute(attribute));

      // run the function on multiple elements
      return this.querySelectorAll("table, thead, tbody, tr, th, td").forEach((elem) => {
       discardAttributes(elem, "cellspacing", "cellpadding", "width", "style");
    });

  }))
  .pipe(gulp.dest("dist"));
});

Isto parece promissor, eu estou a tentar. Perguntas: eu não vejo jsdom em qualquer lugar do código, como ele chegou aqui? Desculpa a minha pergunta idiota, mas eu sou novo nó. ATUALIZAÇÃO: de Acordo com a ngp docs, "[Gole-dom] plugin envolve jsdom. Porém, este plugin não permite que todos os recursos fornecidos pelo jsdom. O único propósito para jsdom este plugin é para analisar um documento HTML em um DOM para que possamos executar operações sobre ela."
Ele funciona! Muito obrigado. Aqui está o que eu fiz. (1) eu instalei jsdom como um devDependancy (2) eu instalei o gulp-dom como um devDependancy (3) eu colei o código acima e correu gole. Desculpe, eu não posso vote positivamente ainda.
O gulp-dom plugin inclui o jsdom, sem a necessidade de instalá-lo separadamente. Se você está feliz com a resposta que você pode aceitar.

Eu preciso escrever um personalizado Gole tarefa que irá remover atributos do meu HTML

Pergunta

Melhor resposta

Em outros idiomas

Esta página está em outros idiomas

Popular nesta categoria

Perguntas populares nesta categoria