Enable CSS Custom Properties while saving to HTML with JavaScript via C++
Contents
[
Hide
]
Possible Usage Scenarios
When you save your Excel file to HTML, for the scenario that there are multiple occurrences for one base64 image, with custom property the image data only needs to be saved once so the performance of the resultant HTML can be improved. Please use HtmlSaveOptions.enableCssCustomProperties property and set it true while saving to HTML.
Enable CSS Custom Properties while saving to HTML
The following sample code shows the usage of HtmlSaveOptions.enableCssCustomProperties property. The screenshot shows the effect of this property when it is not set to true. Please download the sample Excel file used in this code and the output HTML generated by it for reference.
Sample Code
<!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>