Question

我在桌面浏览器中有以下html

<div class="mygallery-thumbs">
  <span>
    <img />
  </span>
</div>

以及移动浏览器中的以下html

<div class="mygallery-thumbs">
  <span>
    <span class="mjwideimg">
       <img />
    </span>
  </span>
</div>

所以我需要解包.mjwideimg但是解包函数不支持任何参数。如果我喜欢以下内容：

//$('.mygallery-thumbs').find('img').unwrap('.mjwideimg');//parameters not supported
$('.mygallery-thumbs').find('img').unwrap();

这将在桌面浏览器中生成:(不可行）

<div class="mygallery-thumbs">
    <img />
</div>

并将在移动浏览器中生成如下:(没关系）

    <div class="mygallery-thumbs">
      <span>
        <img />     <-----------------------------------------------------------
      </span>                                                                  |
    </div>                                                                     |
                                                                               |
So I want the output in both browser like mobile browser output. ---------------

如何解开.mjwideimg？

Answer 1

这是另一种方式：

$('.mygallery-thumbs').find('span.mjwideimg img').unwrap();
//---------------------------^^^^^^^^^^^^^^^^^^------------find it here to unwrap

您可以尝试这样做：

 var myImg = $('.mygallery-thumbs').find('span.mjwideimg').html();
 $('.mygallery-thumbs').find('> span').html(myImg);

Demo @ Fiddle

Answer 2

$('.mygallery-thumbs span.mjwideimg').find('img').unwrap();

Answer 3

你可以这样做：

$('.mygallery-thumbs span.mjwideimg').find('img').unwrap();

或者您可以检查它是否在移动设备上然后打开它：

if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
    $('.mygallery-thumbs').find('img').unwrap();
}

如何解开指定类名的跨度？

3 个答案:

Demo @ Fiddle