Javascript 使用jQuery在不使用ID和名称的情况下实现跨度的单击事件

如何使用jQuery单击下面的span选项卡

像这样：

扩展搜索

您可以将css类添加到span中，并使用css类作为jQuery选择器来注册

单击事件

<span class="myspan" id="someId">Test</span>
<span class="myspan" id="someOtherId">Test Again</span>

这是一个工作样本

如果无法向该范围添加css类或其他属性，则可能需要使用非常广泛的jQuery选择器，这只是
span
标记

$("span").click(function(e){
  alert("clicked");
});

但此单击事件将注册到您页面中的所有span。另一个选项是将这些跨距包装在容器div中，并在jQuery选择器中使用它，以便只有这些跨距才会注册为click事件

<div id="myContainer">
   <span data-bind="event: {click: toggleshow}, css: {open: more()}" class="">
                                                          Expand<span></span>Search</span>
</div>

jQuery可以使用几乎任何CSS选择器

因此，如果您不想使用类或id（您应该这样做），有两个选项：

关于CSS选择器，并找到合适的选择器
打开
在浏览器中的inspector工具中，右键单击您的范围
元素，并选择“复制唯一”选项
选择器”（Firefox）或“复制>复制选择器”（Chrome）以获取
为元素自动生成的选择器
然后将其与jQuery一起正常使用：
$（“复制粘贴的选择器”）。在html使用中单击（）

</span><span>Search</span>

这将与Expand span一起工作。。使用相同的方法搜索一个
您可以使用
事件
对象来查找
节点类型

HTML

事件对象有许多其他键，这些键在需要时也很方便。您只需
console.log（event）
即可查看其他键


注意：我使用多个标签只是为了演示。虽然每个元素都有一个类，但我只是用它来设计样式

希望这将是有用的
？你只是想触发一个点击事件吗？嗨，Jacques，是的，我只是想在这个spanThx Shyju上实现点击事件，我不能添加任何类名或id，因为我正在尝试学习如何使用Jquery处理任何情况。这是我的目标。不需要Id。我只是将其添加到中，以便在示例中单击时发出警报。只需要css类css类是空的，我在Chorme的开发者工具（F12）中找不到它。你的意思是，它是空的。您需要将css类添加到标记中。我知道CSS类应该有一个值，但棘手的是没有。我向您展示了整个span元素：expandSearch那么，您的意思是我只需要将元素和过去复制到jQuery中？Thx，我现在就来试试。你得到的字符串应该是这样的：
\comment-56785674>td:nth child（2）>div:nth child（1）>span:nth child（1）
我只需要实现点击事件，那么我可以像这样重写你的代码吗$（'span'）.filter（函数（）{return$（this）.text（）.trim（）=='Expand'；}）。单击（）@桃峰用演示更新了答案。。单击“展开范围”there@TaotaoFeng是的，您也可以使用。单击（）。。但我以前在很多情况下都使用.on（）来工作，扩展搜索有两个跨度很抱歉，我仍然无法实现点击功能，这不是我的html，我刚刚从网上找到一个，我只是想练习我的jQuery技能
$(function(){

     $("#myContainer span").click(function(e){
     alert("clicked");

   });

});

</span><span>Search</span>

 <span></span>Search</span>

$('span').filter(function(){
   return $(this).text().trim() == 'Expand';
}).on('click' , function(){
      //code here for Expand span
});

<span class="item-content">Button 1 </span>
<span class="item-content">Button 2 </span>
<div class="item-content">Button 3 </div>
<button class="item-content">Button 4 </button>

$('body').on('click',function(event){
alert(event.target.nodeName)
})