Question

我正在使用谷歌地图绘图管理器。他们没有在绘图工具按钮栏上放置id或类名，所以我自己试着这样做。

首先我要删除下面工作正常的圆形按钮，但是我想添加自己的按钮，所以需要在父级“gmnoprint”中添加一个类名，但google有大约5个div都是同一个类名称。我只想将它添加到找到圆形按钮的那个。

<div class=gmnoprint"></div>
<div class=gmnoprint"></div>
<div class=gmnoprint"></div>
<div class=gmnoprint">
    <div>
        <div> <== This is what I found in my search
            <span>
                <div>
                    <img></img>
                </div>
            </span>
        </div>
    </div>
</div>

我能够找到我想要的元素并删除它，但是为它包装div添加一个类对我来说有点困难。

这适用于删除按钮

$(".gmnoprint").each(function(){
   $(this).find("[title='Draw a circle']").remove();
});

这不起作用..只需将该类添加到所有“.gmnoprint”div的

$(".gmnoprint").each(function(){
   $(this).find("[title='Draw a circle']").remove().parent().addClass("test");
});

Answer 1

remove()从DOM中删除元素并返回独立的jquery对象，该对象根本没有与DOM的连接。调用parent()后对remove() 的调用不正确，这可能是导致问题的原因。

尝试将您的陈述拆分为：

var toRemove = $(this).find("[title='Draw a circle']"); toRemove.parent().addClass("test"); toRemove.remove();

Answer 2

您可以使用jQuery insertAfter并在默认按钮后退出按钮，然后将其删除。

$(".gmnoprint").each(function(){
   var defBtn = $(this).find("[title='Draw a circle']");
   $('<button class="my-button" />').insertAfter(defBtn);
   defBtn.remove();
});

或者像这样使用jQuery after：

$(".gmnoprint").each(function(){
   $(this)
      .find("[title='Draw a circle']")
      .after($('<button class="my-button" />'))
      .remove();
});

Answer 3

您可以使用child selector定位元素

$(".gmnoprint > div > div").addClass('myClassName');

此时你可以替换整个div的html，或者找到span并替换它的内部html。使用html()方法，您不需要使用remove()，因为它将替换元素的所有内容

 $(".gmnoprint > div > div").addClass('myClassName').find('span').html('<newButton>');

API参考：http://api.jquery.com/child-selector/

将类添加到父div

3 个答案: