Answer the question
In order to leave comments, you need to log in
Why does the Cannot set property 'innerHTML' of null error occur?
I am solving a task for the university on text recognition from pictures. In my code, I use Tesseract.js as the main tool and Browserify in order to run in the browser from the locale.
Error code:
MainScript.js:15 Uncaught TypeError: Cannot set property 'innerHTML' of null
at updateProgress (MainScript.js:15)
at createWorker.js:176
at Worker.worker.onmessage (onMessage.js:3)
Script code:
var Tesseract = require('tesseract.js')
// Image recognition
function recognize(file, lang, logger) {
return Tesseract.recognize(file, lang, {logger})
.then(({ data: {text }}) => {
return text;
})
}
const log = document.getElementById('log');
// Keep track of processing progress
function updateProgress(data) {
log.innerHTML = '';
const statusText = document.createTextNode(data.status);
const progress = document.createElement('progress');
progress.max = 1;
progress.value = data.progress;
log.appendChild(statusText);
log appendChild(progress);
}
// Outputting the result
function setResult(text) {
log.innerHTML = '';
text = text.replace(/\n\s*\n/g, '\n');
const pre = document.createElement('pre');
pre.innerHTML = text;
log.appendChild(pre);
}
document.getElementById('start').addEventListener('click', () => {
const file = document.getElementById('file').files[0];
if (!file) return;
const lang = document.getElementById ('langs').value;
recognize(file, lang, updateProgress)
.then(setResult);
});
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question