javascript - 通过 id 传递元素适用于纯 javascript 但无法使用 jQuery

Question

我有一段非常简单的代码，我在其中获得了某个 id，而我想做的是更改元素的 css。 代码如下所示:

<script>
 jQuery('.sitePick').click(function(event){
   var site = (event.target.href.split("#")[1]); // get the id
   console.log(site); // make sure i get the correct id
   jQuery('#' + site).css("display" , "block"); //change css
});
</script>

日志打印元素的正确 ID，当我尝试使用相同的 ID 时，如下所示:docuemnt.getElementById(site).style.display = "block" 它有效，但在使用 jQuery 时无效。 最让我担心的是，即使我按原样(jQuery("#dummySite") 将 id 传递给 jQuery，它仍然无法正常工作..知道我做错了什么吗？谢谢

更新

站点的值为“site_buzzy.com”。 我在文件开头加载 jquery，其他 jquery 方法有效。脚本在内容之后加载。

Answer 1

您需要以某种方式转义点，以将 site 字符串用作 jQuery 选择器。

var site = (event.target.href.split("#")[1]).replace(/\./g, "\\.");

现在这可以简化为:

var site = event.target.hash.replace(/\./, "\\."); // get the id
jQuery(site).show();

jQuery('.sitePick').click(function(event) {
  var site = event.target.hash.replace(/\./, "\\."); // get the id
  jQuery(site).show(); //change css
});

.hidden {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a class="sitePick" href="#site_buzzy.com">Site Pick</a>
<br />
<div id="site_buzzy.com" class="hidden">The DIV #site_buzzy.com</div>