Question

以下JavaScript ＆＃34; if＆＃34; 语句未读取参数，因为我打算读取两个参数。当我使用使用间隔运行 bulletOneLeft ++; 的函数拍摄 bulletOne 时， bulletOne 的左侧CSS属性会按照预期的每个间隔增加1 。但是，当我编写以下 if 语句来检测 bulletOne 的CSS style.left属性并将其与名为＆＃的元素的CSS style.left属性进行比较时34;的 targetBox ＆＃34 ;;代码无法识别这两个元素的CSS style.left属性的差异。我的问题是如果一旦bulletOne的CSS style.left属性大于targetBox的CSS style.left属性，我怎样才能使这个 if 语句执行？

if (bulletOneLeft > targetLeftProp){
document.getElementById("targetBox").style.opacity = "0";   
};

使用以下代码描述 bulletOneLeft 和 targetLeftProp 这两个参数;

bulletOneLeft;

#bulletOne {
position: absolute;
background-color: white;
height: 1px;
width: 6px;
top: 0px;
left: 0px;
}
bulletOne.style.left = bulletOneLeft;

targetLeftProp;

#targetBox{
position: absolute;
background-color: green;
height: 20px;
width: 20px;
top: 30px;
left: 310px;
opacity: 1;
}
var targetLeftProp = window.getComputedStyle(CSSelement, 
null).getPropertyValue("left");

以前失败的尝试; 我尝试了很多不同的代码组合，以下是我第一次失败的尝试。以下代码似乎是当时最符合逻辑的代码;

var bulletLeft = document.getElementById("bulletOne").style.left;
var targetLeft = document.getElementById("targetBox").style.left;

if (bulletOneLeft > targetLeft){
   document.getElementById("targetBox").style.opacity = "0";   
};

Answer 1

首先，你犯了一个错字，这就是为什么它在失败的尝试中不起作用的原因。

您的变量名为bulletOne，但您使用bulletOneLeft执行if语句。

另外：

style.left;

返回一个字符串，所以你必须使用parseFloat函数或parseInt，如果你确定它总是一个int（https://www.w3schools.com/jsref/jsref_parsefloat.asp，https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/parseInt），如下所示：

var bulletOne = parseFloat(document.getElementById("bulletOne").style.left;

你相信我很高兴。

＆＃34;如果＆＃34;语句参数不按预期运行。 JavaScript的

1 个答案: