如何用JS获取通过ID选中元素内的标记值？

我用这段代码获取元素：

const elem = document.getElementById("TcHmiRecipeEdit")
console.log(elem);

执行后控制台输出的元素结构如下：

我刚接触JavaScript，不知道怎么写代码提取图中标注的那个值，求帮助。

解决方法 #

根据你提供的元素结构，可以通过属性链直接访问目标值：

// 直接访问属性链获取值
const targetValue = elem.__tcHmiSymbol.__symbol.__children.DATA_RECIPE_SELECTED_VALUE.__symbol.__value;
console.log(targetValue);

如果担心属性不存在导致报错，可以用可选链操作符（?.）做兼容处理：

// 带兼容判断的写法
const targetValue = elem?.__tcHmiSymbol?.__symbol?.__children?.DATA_RECIPE_SELECTED_VALUE?.__symbol?.__value;
console.log(targetValue);

注意：这类以双下划线开头的属性属于框架内部私有属性，可能会随版本更新发生变化。如果是正式项目使用，建议优先查看对应框架（TcHmi）的官方文档，确认是否有公开的API来获取该值，避免依赖私有属性带来的兼容性问题。

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