Estoy tratando de agregar un texto HTML a un archivo HTML usando cheerio. Específicamente para agregar una barra de navegación. Sin embargo, cada vez que se llama a la función y abro el archivo HTML para ver si se adjunta la barra de navegación, no hay nada. ¿Alguien puede ayudar?
var addNavBarW3CSS = function(){ let readManipulateFileName = 'generated_web/'+fileNameChosen+'.html'; const $ = cheerio.load(fs.readFileSync(readManipulateFileName,'utf8')); var navText=""; rl.question("Please enter Navigation Text: \n",function(answer) { navText='<a href="#contact" class="w3-bar-item w3-button" style="width:25% !important">'+answer+'</a>'; $('#navItem1').append(navText); console.log(navText+" succesfully appended to navigation"); createMobileWebPageSubmenu(); }); }El elemento div dentro de un archivo diferente que estoy tratando de agregar. Básicamente el archivo de la barra de navegación.
<!-- Navbar on small screens (Hidden on medium and large screens) --> <div class="w3-top w3-hide-large w3-hide-medium"> <div class="w3-bar w3-black w3-opacity w3-hover-opacity-off w3-center w3-small" id="navItem1"> <a href="#" class="w3-bar-item w3-button" style="width:25% !important">HOME</a> <a href="#about" class="w3-bar-item w3-button" style="width:25% !important">ABOUT</a> <a href="#photos" class="w3-bar-item w3-button" style="width:25% !important">PHOTOS</a> <a href="#contact" class="w3-bar-item w3-button" style="width:25% !important">CONTACT</a> </div> </div>Debe guardar la salida de cheerio en un archivo después de realizar cambios en el documento de cheerio.
Este ejemplo sobrescribe el archivo readManipulateFileName con el nuevo contenido de cheerio. Si no desea sobrescribir, puede poner un nombre de archivo diferente.
var addNavBarW3CSS = function(){ let readManipulateFileName = 'generated_web/'+fileNameChosen+'.html'; const $ = cheerio.load(fs.readFileSync(readManipulateFileName,'utf8')); var navText=""; rl.question("Please enter Navigation Text: \n",function(answer) { navText='<a href="#contact" class="w3-bar-item w3-button" style="width:25% !important">'+answer+'</a>'; $('#navItem1').append(navText); console.log(navText+" succesfully appended to navigation"); createMobileWebPageSubmenu(); // once all the changes to $ are complete: fs.writeFileSync(readManipulateFileName, $.html(), 'utf8'); }); }Basado en Cómo poner contenido de extracción en html (Node.js, cheerio) y Escribir en un archivo después de modificarlo con cheerio en el nodo
Hola, he encontrado una respuesta a mi problema aquí y le puse algún comentario.
var addNavBarW3CSS = function(){ let readManipulateFileName = 'generated_web/'+fileNameChosen+'.html'; const $ = cheerio.load(fs.readFileSync(readManipulateFileName,'utf8')); var navText=""; rl.question("Please enter Navigation Text: \n",function(answer) { navText='<a href="#contact" class="w3-bar-item w3-button" style="width:25% !important">'+answer+'</a>'; //to append new element $('#navItem1').append(navText).html(); //to make the cheerio object whole HTML again navHTML=$("*").html(); //to write to the HTML file again fs.writeFileSync(readManipulateFileName, navHTML, 'utf8'); console.log(navHTML); createMobileWebPageSubmenu(); }); '''