Javascript 如何在jquery中检查标签是img还是视频？

我想在模式弹出窗口中打开图像/视频，这样我就可以点击按钮显示图像。但当我同时拥有图像和视频时，我就很难在jQuery中检查标记了

用于在弹出窗口中缩放图像的我的html代码

<div>
    <img src="image/zoom-icon.png" id="zoomImg" >
    <div class="bigthumb">
        <img src="image/main_product_img.png" id="myImg" width="350px" height="350px">
        <video class="no-display" width="350px" height="350px" controls>
           <source src="image/movie.mp4" type="video/mp4">
        </video>
    </div>
</div>

<div class="modal fade" id="imagemodal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">              
      <div class="modal-body">
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
        <img src="" class="imagepreview" style="width: 100%;" >
        <video class="videopreview no-display" class="imagepreview" style="width: 100%;" controls>
            <source src="" type="video/mp4">
        </video>
      </div>
    </div>
  </div>
</div>

&时代；接近

jQuery\u文件代码在这里

<script type="text/javascript">
        $('#zoomImg').on('click', function() {
        console.log($(this));
        if ( ---HERE-- ) {
            $('.imagepreview').attr('src', $('.bigthumb').find('img').attr('src'));
            $('#imagemodal').modal('show');
        } else {
            $('.videopreview source').attr('src', $('.bigthumb').find('video source').attr('src'));
            $('.videopreview').show();
            $('#imagemodal').modal('show');   
        }
    });     
</script>

$（'#zoomImg'）。在（'click'，function（）上{
log（$（this））；
如果（---这里--）{
$（'.imagepreview'）.attr（'src'，$（'.bigtumb'）.find（'img'）.attr（'src'））；
$（'#imagemodal'）.modal（'show'）；
}否则{
$（'.videopreview source'）.attr（'src'，$（'bigtumb'）.find（'videosource'）.attr（'src'））；
$（'.videopreview'）.show（）；
$（'#imagemodal'）.modal（'show'）；
}
});     

在上面的脚本中，我想检查您是否可以使用img tage/video tage

根据选择器、元素或jQuery对象检查当前匹配的元素集，如果这些元素中至少有一个与给定参数匹配，则返回true

你可以用

根据选择器、元素或jQuery对象检查当前匹配的元素集，如果这些元素中至少有一个与给定参数匹配，则返回true

---

您可以使用

nodeName

属性检查元素类型：

$(this).prop("nodeName")

或：

这些值将是

IMG

或

VIDEO

nodeName只读属性以字符串形式返回当前节点的名称

参考：

---

您可以使用

nodeName

属性检查元素类型：

$(this).prop("nodeName")

或：

这些值将是

IMG

或

VIDEO

nodeName只读属性以字符串形式返回当前节点的名称

参考：

---

如果您使用的是jQuery，则可以使用其is（）方法，也可以使用普通JS：

$('#zoomImg').on('click', function (evt) {
  switch (evt.currentTarget.tagName) {
    case 'IMG':
      // logic here
      break
    case 'VIDEO':
      // logic here
      break
    default:
      console.warn('Unsupported zoom target')
  }
})

---

PS：主要来说，这比调用.is（）方法快一些，因为没有执行额外的代码。

如果使用jQuery，可以使用它的is（）方法，也可以使用纯JS：

$('#zoomImg').on('click', function (evt) {
  switch (evt.currentTarget.tagName) {
    case 'IMG':
      // logic here
      break
    case 'VIDEO':
      // logic here
      break
    default:
      console.warn('Unsupported zoom target')
  }
})

---

PS：主要是，这比调用.is（）方法快一点，因为没有执行额外的代码。

您可以使用

nodeName

来执行此操作

if(this.nodeName == 'IMG')

---

您可以使用

nodeName

来执行此操作

if(this.nodeName == 'IMG')