使用 clientHeight 会导致 JavaScript 函数失败答案

【问题标题】：Using clientHeight causes JavaScript function to fail使用 clientHeight 会导致 JavaScript 函数失败
【发布时间】：2022-09-24 18:05:52
【问题描述】：

我在文件顶部设置了以下 CSS：

#img1, #img2, #img3 {
  background: url(\"bates-sprite.jpeg\");
  background-repeat: no-repeat;
  object-fit: none;
}

#img1 {object-position: 0 0;
  width:  816px; // full size 3264
  height: 612px; // full size 2448
}

这是我的 JavaScript 的相关部分：

    var tempDiv = document.createElement(\'div\');
    tempDiv.setAttribute(\"id\", \"bigImg\" + figNum);
    // Make tempDiv High enough to hold the scaled up image.

    // This line is causing a problem
    let imgHeight = document.getElementById(\"img1\").clientHeight;

   // let imgHeight = \"1224px\";
   tempDiv.style.height = parseInt(imgHeight) + parseInt(\"400px\") + \"px\";

如果我将 imgHeight 显式设置为 1224 像素，则该函数可以完美运行。相反，如果我使用 clientHeight，它会失败。我该如何解决？

\"失败\"如何?一个错误？没有达到你的预期？如果是，那是什么做它做吗？ debugging你做了什么？
请注意，clientHeight 是数字，而不是字符串。没有理由在上面使用parseInt。而parseInt(\"400px\") 似乎是一种奇怪的迂回方式来写400。 :-)

标签： javascript html css

【解决方案1】：

客户端高度只会给出数字，但您需要添加类型，例如（px、%、rem）。让它发挥作用

【讨论】：

你俩都是对的。 “失败”是指没有执行进一步的语句。为了调试，我打印了一条简单的消息，表明到目前为止一切正常。因此，我能够找到导致问题的语句。