用event.target获取标签名称的元素



在使用event.target

中,在JavaScript的单击事件中,如何获得<span>的第一个孩子<li>
var aEl = event.target.querySelector('a')

//Using jQuery
$(".jq").click(function(event){
  var aTag = event.target.querySelector("a");
  console.log(aTag.innerHTML);
  return false;
});
//Using vanilla Javascript
function clicker(event){
    var aTag = event.target.querySelector("a");
    console.log(aTag.innerHTML);
    return false;
}
document.querySelector("span.vanilla").addEventListener("click",clicker,false);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="jq">
Using jQuery
<a href="#">First jQuery Link</a>
<a href="#">Second Link</a>
</span>
<br/><br/><br/>
<span class="vanilla">
Using only Javascript
<a href="#">First Vanilla jQuery Link</a>
<a href="#">Second Vanilla Link</a>
</span>

您可以使用此

在脚本上

<script>
    function myFunction(elmnt) {
        var li = elmnt.querySelector('a:first-child');        
    }
</script>

html

    <span  onclick="myFunction(this)">
   <a href="#">Sampe1</a>
    <a href="#">Sample2</a>
    </span>

最新更新