Habilitar propiedades personalizadas de CSS al guardar en HTML con JavaScript vía C++
Contents
[
Hide
]
Escenarios de uso posibles
Cuando guardas tu archivo de Excel en HTML, para el escenario en que hay múltiples ocurrencias de una misma imagen en base64, con la propiedad personalizada, los datos de la imagen solo necesitan guardarse una vez, mejorando así el rendimiento del HTML resultante. Usa HtmlSaveOptions.enableCssCustomProperties y configúralo a true al guardar en HTML.
Habilitar Propiedades Personalizadas de CSS al guardar en HTML
El siguiente código de ejemplo muestra el uso de la propiedad HtmlSaveOptions.enableCssCustomProperties. La captura de pantalla muestra el efecto cuando no está configurada en true. Descarga el archivo de Excel de ejemplo utilizado en este código y el HTML generado para referencia.
Código de muestra
<!DOCTYPE html>
<html>
<head>
<title>Enable CSS Custom Properties Example</title>
</head>
<body>
<h1>Enable CSS Custom Properties Example</h1>
<input type="file" id="fileInput" accept=".xls,.xlsx" />
<button id="runExample">Run Example</button>
<a id="downloadLink" style="display: none;">Download Result</a>
<div id="result"></div>
</body>
<script src="aspose.cells.js.min.js"></script>
<script type="text/javascript">
const { Workbook, SaveFormat, Worksheet, Cell, Utils } = AsposeCells;
AsposeCells.onReady({
license: "/lic/aspose.cells.enc",
fontPath: "/fonts/",
fontList: [
"arial.ttf",
"NotoSansSC-Regular.ttf"
]
}).then(() => {
console.log("Aspose.Cells initialized");
});
document.getElementById('runExample').addEventListener('click', async () => {
const fileInput = document.getElementById('fileInput');
if (!fileInput.files.length) {
document.getElementById('result').innerHTML = '<p style="color: red;">Please select an Excel file.</p>';
return;
}
const file = fileInput.files[0];
const arrayBuffer = await file.arrayBuffer();
// Instantiating a Workbook object from the uploaded file
const workbook = new Workbook(new Uint8Array(arrayBuffer));
// Create HtmlSaveOptions and set properties (converted from setters to property assignments)
const opts = new AsposeCells.HtmlSaveOptions();
opts.exportImagesAsBase64 = true;
opts.enableCssCustomProperties = true;
// Save the workbook to HTML using SaveFormat.Html and provided options
const outputData = workbook.save(SaveFormat.Html, opts);
const blob = new Blob([outputData], { type: 'text/html' });
const downloadLink = document.getElementById('downloadLink');
downloadLink.href = URL.createObjectURL(blob);
downloadLink.download = 'outputEnableCssCustomProperties.html';
downloadLink.style.display = 'block';
downloadLink.textContent = 'Download HTML File';
document.getElementById('result').innerHTML = '<p style="color: green;">HTML saved successfully! Click the download link to get the file.</p>';
});
</script>
</html>