Musím napísať vlastné Dúškom, že úlohou bude odstrániť atribúty z môjho HTML

0

Otázka

Ja som nutnosti Dúškom úlohy, ktoré pôjdu cez všetky priradené dokumenty HTML a odstrániť určité atribúty (ako napr. style=""). Myslel som, že som nebol schopný robiť to to isté, ako som to urobiť prostredníctvom prehliadača, ale vyzerá to nie. Tu je to, čo som sa snaží urobiť:

// 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");
});

Ja by som chcel potom sa vyššie uvedeného vzorca a vytvoriť dúškom.úlohou páči, takže:

const gulp = require("gulp");

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

Ak nie je plug-v ktoré by som mohol využiť to, že bude robiť to, prosím, zdieľať, ale tiež, chcela by som sa dozvedieť, ako to urobiť ručne, ako je tento.

By som sa musieť použiť through2?

Ďakujem.

gulp javascript npm
2021-11-20 16:26:41
1

Najlepšiu odpoveď

0

Môžete použiť niektoré uzol dom, knižnica a zabaliť to s dúškom. Napríklad by ste mohli skúsiť jsdom a wrapper dúškom-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"));
});
2021-11-21 17:18:21

To vyzerá sľubne, chystám sa to vyskúšať. Otázky: nevidím jsdom kdekoľvek v kóde, ako to vstupujú do hry tu? Ospravedlňte moju hlúpe otázky, ale som nový uzol. AKTUALIZÁCIA: Podľa npm dokumenty, "[Dúškom-dom] plugin zábaly jsdom. Hoci, tento plugin neumožňuje všetky funkcie, ktoré poskytuje jsdom. Jediným dôvodom pre jsdom v tento plugin je analyzovať HTML dokumentu do DOM, aby sme mohli spustiť operácie na to."
desert_dweller

Funguje to! Ďakujem. Tu je to, čo som urobil. (1) nainstaloval som jsdom ako devDependancy (2) nainstaloval som dúškom-dom ako devDependancy (3) som prilepený vyššie uvedený kód a bežal dúškom. Je nám ľúto, nemôžem upvote ešte.
desert_dweller

Na dúškom-dom plugin obsahuje jsdom, nie je potrebné ho nainštalovať samostatne. Ak ste spokojní s odpoveďou, môžete to prijať.
Nikolay

V iných jazykoch

Táto stránka je v iných jazykoch

Русский
..................................................................................................................
Italiano
..................................................................................................................
Polski
..................................................................................................................
Română
..................................................................................................................
한국어
..................................................................................................................
हिन्दी
..................................................................................................................
Français
..................................................................................................................
Türk
..................................................................................................................
Česk
..................................................................................................................
Português
..................................................................................................................
ไทย
..................................................................................................................
中文
..................................................................................................................
Español
..................................................................................................................