Javascript 使用多个变量引用HTML ID

因此，我试图创建一个游戏，在这个关卡中有来自服务器的块

每次从服务器接收到更新时，我都会在块之间循环。然后，如果块是实心的，它会将块附加到html文档中（如果它还不存在）

if(blocks[blockCount].solid === true){
            if($("#" + blocks[blockCount].posX.toString() + "," + blocks[blockCount].posY.toString()).length > 0){
               alert("Block already exists");
            }else{
                $("body").append("<div style='height: " + blockSize + "px;width:  " + blockSize + "px;background-color: blue;position: absolute;display: inline;margin-left: " + blocks[blockCount].posX * blockSize + "px;margin-top: " + blocks[blockCount].posY * blockSize + "px;' id='" + blocks[blockCount].posX.toString() + "," + blocks[blockCount].posY.toString() + "'> </div>");
            }
        }

if（块[blockCount].solid==true）{
if（$（“#”+块[blockCount].posX.toString（）+”，“+块[blockCount].posY.toString（））.length>0）{
警报（“块已存在”）；
}否则{
$（“正文”）。追加（“”）；
}
}

块[blockCount]。posX和Y都应等于4。但是由于某些原因，它们一直被创建，if语句由于某些原因不起作用。你能解释一下为什么吗？或者发布正确的代码。非常感谢你的帮助。：）

我在这里学到：

---

使用jquery.length可以查看元素是否已经存在

在ID（或类）中不能有a（参见注释，可以，但为什么要让自己的生活变得艰难），因为a在CSS中用作分隔符。。i、 e

#id1，div

将选择id=“id1”的元素和任何

div

您正在创建id为“123456”的元素，作为CSS选择器，它应该是

#123456

解决方案：尝试使用u而不是

另外，我不确定一个id是否允许以数字开头，但请不要告诉我，如果不允许，只需在您的id前面加上x或其他什么

注意：HTML5规范允许ID以数字开头，但这在CSS选择器中也不起作用（至少对于CSS而言，没有使用jQuery或querySelector[All]进行测试）

---

您将得到类似于

x123_456

的id，这很正常因为

，

在CSS中有特殊含义，您必须在选择器中转义。要使用

id=“foo，bar”

编写针对元素的CSS选择器，必须编写

#foo\，bar

。在jQuery中，选择器允许您执行相同的操作，但您需要记住JS语法，并编写

$（“#foo\\，bar”）

，以实现您想要的功能（第一个反斜杠是在JS字符串中转义第二个反斜杠）

另外，正如Jaromanda X所指出的，ID不能以数字开头，所以你必须在它前面加一个字母

总之，您的代码可能如下所示：

if(blocks[blockCount].solid === true){
    if($("#x" + blocks[blockCount].posX.toString() + "\\," + blocks[blockCount].posY.toString()).length > 0){
       alert("Block already exists");
    } else {
        $("body").append("<div style='height: " + blockSize + "px;width:  " + blockSize + "px;background-color: blue;position: absolute;display: inline;margin-left: " + blocks[blockCount].posX * blockSize + "px;margin-top: " + blocks[blockCount].posY * blockSize + "px;' id='x" + blocks[blockCount].posX.toString() + "," + blocks[blockCount].posY.toString() + "'> </div>");
    }
}

if（块[blockCount].solid==true）{
if（$（“#x”+块[blockCount].posX.toString（）+“\\，“+块[blockCount].posY.toString（））.length>0）{
警报（“块已存在”）；
}否则{
$（“正文”）。追加（“”）；
}
}

非常感谢，这就是问题所在。如果我能给你机会，我会的。这似乎不管用：/给了你名声，答案很好：）我的答案不是很正确。除了“空格字符”之外，ID没有任何限制-但是，正如我在另一个答案上的评论中所说的，为了便于使用，如果可能的话，只使用在CSS选择器中没有特殊意义的字符，并且（我的个人限制）不需要在RegExp中转义-使生活变得更加轻松是的，响应您以前的（现在已删除）注释：HTML5在

ID

值方面比HTML4更具灵活性。这里有一个快速回顾：实际上我有点错了，HTML5中对ID的唯一限制是没有空格字符-

对于ID可以采取什么形式没有其他限制；特别是，ID可以仅由数字组成，以数字开头，以下划线开头，仅由标点符号组成，等等。

-。。。然而，为了便于使用，我会坚持使用字母数字和一些标点符号，但不会混淆css选择器（#，：>和其他我现在想不到的东西）-我也不会使用必须在regexp中转义的字符用数字启动ID似乎不起作用（至少在Chrome中）：我不会感到惊讶，然而，正如你所看到的，HTML5规范确实允许这样做（并不意味着每个浏览器都会这样做——firefox也会通过你的redfoo测试），因为我们都知道，该规范有时可能与浏览器中的实现相差甚远：）在我的例子中，从一个数字开始并没有产生任何问题。