const element = document.getElementById('pdf-container')会报错Cannot read property 'getElementById' of undefined

这个错误可能是因为你在浏览器端的 JavaScript 代码中使用了 DOM API，但是代码执行时并没有找到对应的文档对象。一种可能的原因是代码执行的时机不对，可能需要等到 DOM 加载完成后再执行相关代码。

你可以尝试将代码放到下面这个事件监听函数中：

window.addEventListener('DOMContentLoaded', function() {
  // 在这里执行相关代码
});

或者使用 jQuery 等库中提供的 ready 函数：

$(document).ready(function() {
  // 在这里执行相关代码
});

这样可以确保代码执行时 DOM 已经加载完毕，可以安全地使用 DOM API。同时，也可以检查一下是否正确引入了相关的 JS 文件。

相关问题

使用const containerRect = container.getBoundingClientRect(); 报错Cannot read properties of null (reading 'getBoundingClientRect') 怎么解决

报错信息表明在调用`getBoundingClientRect()`方法时，`container`的值为null，无法读取属性'getBoundingClientRect'。要解决这个问题，你可以检查以下几点：

1. 确保`container`是一个有效的元素或DOM节点。可以通过使用调试工具检查`container`的值是否为null或undefined。如果是，需要找到正确的元素或节点来替代。

2. 确保代码执行时，DOM已经加载完毕。如果代码在DOM加载之前执行，容器元素可能还不存在。你可以将代码放在DOMContentLoaded事件处理程序中，以确保在DOM加载完成后再执行相关操作：

document.addEventListener("DOMContentLoaded", function() {
  const container = document.getElementById("container"); // 替换成正确的容器元素选择器
  const containerRect = container.getBoundingClientRect();
  // 其他代码逻辑...
});

3. 检查是否存在其他代码错误导致`container`变量被意外更改为null。请确保在调用`getBoundingClientRect()`之前没有对`container`进行任何操作或赋值。

通过检查以上几点，你应该能找到并解决报错的原因。

uniapp中使用document.getElementById()报错：Cannot read property 'getElementById' of undefined

在uniapp中，使用document.getElementById()会报错"Cannot read property 'getElementById' of undefined"是因为uniapp是基于Vue框架开发的，而Vue框架中没有直接使用原生的document对象来操作DOM元素。

在Vue中，可以使用ref属性来获取DOM元素。ref属性可以在模板中给元素添加一个唯一的标识，然后通过this.$refs来获取对应的DOM元素。

例如，在模板中给一个元素添加ref属性：

<template>
<div ref="myElement">Hello Uniapp</div>
</template>

然后在JavaScript代码中，可以通过this.$refs来获取该元素：

<script>
export default {
mounted() {
const element = this.$refs.myElement;
console.log(element);
}
}
</script>

这样就可以获取到对应的DOM元素了，而不需要使用document.getElementById()。