将querySelector获取的meta标签值转为布尔值时遇TS2339错误

问题分析 #

你的代码有两个核心问题导致报错：

1. 属性误用：meta标签的内容存储在content属性中，而非value；
2. TypeScript类型约束：document.querySelector返回Element | null类型，Element没有content属性，需要明确断言为HTMLMetaElement，同时要处理元素可能不存在的情况。

正确代码示例 #

方式一：先判断元素存在再处理 #

const metaElement = document.querySelector('meta[name="accepted-cookies"]') as HTMLMetaElement | null;
// 元素不存在时默认设为false，可根据需求调整默认值
const acceptedCookies = metaElement ? metaElement.content === 'true' : false;

方式二：使用可选链简化代码 #

// 用可选链处理元素不存在的情况，默认值设为false
const acceptedCookies = (document.querySelector('meta[name="accepted-cookies"]') as HTMLMetaElement)?.content === 'true' || false;

关键说明 #

• 类型断言as HTMLMetaElement告知TypeScript该元素为meta标签类型，允许访问content属性；
• 处理null情况是为了避免元素不存在时触发运行时错误；
• 通过对比content值与字符串"true"，将结果转为布尔类型。

内容的提问来源于stack exchange，提问作者PixelPaul