javascript - 如何避免特定类应用css

标签 javascript jquery html css

My HTML

<body>
<div id="finalparent">
<!--many parent divs here-->
<div id="1stparent">
     <div id="txt_blog_editor" class="box" style="width: 1097px;">
      <div class="abc anotherclass">

       </div>
    </div>
 </div>
</div>
<div class="abc"></div>
</body>

My Script

 $('html').on('mouseover','.fr-bttn .fa-picture-o', function () {
        var pos = $(this).offset();
        console.log(pos.left+"||"+pos.top);
        var left_pos=(pos.left-15)+"px";
        var top_pos=(pos.top+35)+"px";
               $(".abc").css({position: "absolute", top: top_pos,  left: left_pos });
               $(".abc").show();
               $(".popup").show();
        });

    });

我想将 lefttop 应用于没有父级的 abc 类,而不是 下的类id="txt_blog_editor"

最佳答案

根据 this answer这是一个工作片段:

jQuery.expr[':'].noparents = function(a,i,m){
    return jQuery(a).parents(m[3]).length < 1;
};


var elts = $(".abc").filter(":noparents(#txt_blog_editor)");
elts.css({ "background-color": "green" });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="finalparent">
<!--many parent divs here-->
<div id="1stparent">
     <div id="txt_blog_editor" class="box" style="width: 1097px;">
      <div class="abc anotherclass">
                ABC With Parent
       </div>
    </div>
 </div>
</div>
<div class="abc">ABC WITHOUT Parent</div>

基本上,您创建一个新的 jQuery 表达式 :noparents,它返回没有给定选择器父元素的元素

关于javascript - 如何避免特定类应用css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26034183/

相关文章:

javascript - 没有提及的命令

html - 图像缩放 IE8

jquery - 给定两个元素,将 html 包裹在异构元素周围?

javascript - 在 AngularJS 中更改 URL 而不重新加载

html - 如何构建一个扩展到视口(viewport)的简单 CSS 布局?

javascript - 如何干净地因式分解两个几乎相似的函数

javascript - 如何从纯 JavaScript 函数中恢复源代码?

javascript - 使用点运算符加载图像

javascript - 如何解决我的 jquery 插件问题?

javascript - 单击具有相同类的按钮时如何获取特定元素的值