如何在用户脚本中将ID为lblFcost的价格值插入iframe的SRC属性

问题原因 #

你当前的代码存在两处核心错误：

• 直接在单引号包裹的HTML字符串内写+ lblFcost，不会被识别为JS变量拼接，只会作为普通字符串内容输出到iframe的src属性中
• 没有主动从DOM中读取id为lblFcost的元素内容，lblFcost不是浏览器自动生成的全局变量，需要手动调用DOM接口获取对应值

修复后代码 #

// 读取价格元素
const priceElement = document.getElementById('lblFcost');
// 做元素存在校验，避免页面不存在对应元素时报错
if (priceElement) {
  // 提取价格文本并去除前后冗余空格
  const rawPrice = priceElement.textContent.trim();
  const targetDiv = document.getElementById('tblManConNoteMsg');
  if (targetDiv) {
    // 使用模板字符串拼接URL，encodeURIComponent处理特殊字符避免URL传参异常
    targetDiv.innerHTML = `<iframe id="inlineFrameExample" width="1000" height="1000" src="https://exampleurl.com/tnt-surcharge/?price=${encodeURIComponent(rawPrice)}"></iframe>`;
  }
}

补充说明 #

如果需要兼容老版本浏览器不支持模板字符串，可以改用字符串加号拼接写法：

targetDiv.innerHTML = '<iframe id="inlineFrameExample" width="1000" height="1000" src="https://exampleurl.com/tnt-surcharge/?price=' + encodeURIComponent(rawPrice) + '"></iframe>';

encodeURIComponent是必要参数处理逻辑，可避免价格包含特殊字符（比如¥、空格、小数点、千分位符号等）时URL传参出错。

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