简体   繁体   English

使用Javascript删除没有ID或类的div

[英]Removing a div with no id or class with Javascript

My wordpress blog is having issues with syntax highlighter evolved plugin, and there's this weird div element popping out: 我的wordpress博客存在语法突出显示工具演变插件的问题,并且弹出了这个奇怪的div元素:

<div style="z-index: -1; position:absolute; top:0px; left: 0px; width: 100%; height: 4031px;"></div>

This causes my page to extend, creating a big space at the end of the page. 这导致我的页面扩展,在页面末尾创建了一个很大的空间。 This also is found on every wordpress blog. 在每个wordpress博客上也可以找到此内容。 Funny thing is, only chrome sees that (using Inspect Element). 有趣的是,只有chrome可以看到(使用Inspect Element)。 I've already tried in IE9 developer tools and FF firebug, the div is not there and my page is fine. 我已经在IE9开发人员工具和FF firebug中进行过尝试,div不存在,我的页面很好。

NOTE : I've already posted a separate question here . 注意 :我已经在这里发布了一个单独的问题。 And my question here is different from that. 我的问题与此不同。

I want to fix this little problem so bad, and it just came to my mind to use JavaScript for this. 我想把这个小问题修复得如此糟糕,我想到了为此使用JavaScript。 What I want to do is: Remove the div with javascript . 我想做的是: 用javascript删除div

It's easy removing a div with an ID or class, but this one doesn't have any. 删除具有ID或类的div很容易,但是这个没有任何ID或类。 I also do not want to affect all the other divs. 我也不想影响所有其他div。 How can I accomplish this? 我该怎么做?

PS It has no parent IDs or class. PS它没有父级ID或类。 It's right after the container class div. 就在容器类div之后。 It's parent is <body> . 它的父母是<body>

EDIT : Here's the html: 编辑 :这是html: 替代文字

If it's always last or close to last you can use jQuery or normal CSS3 selectors 如果总是最后一个或接近最后一个,则可以使用jQuery或普通的CSS3选择器

$('body > div:last-child').remove();

OR 要么

$('body > div:nth-last-child(n)').remove();

More on CSS3 Selectors and .remove() 有关CSS3选择器.remove()的更多信息

OR you could use CSS ie 或者您可以使用CSS即

body > div:last-child (or div:nth-last-child(n)) {
  display: none;
}

If you are using jQuery, You can reference the div using a parent or sibling div that might have an ID or class defined. 如果使用的是jQuery,则可以使用可能定义了ID或类的父级或同级div引用div。

For examample : 例如:

<div id="parentDIVID">

  <div>your problem div</div>

</div>


Then you can use jQuery to reference your problem div like this : $("#parentDIVID > div")

If you can provide more html code surrounding your problem div, we can construct a jQuery selector that will work in your case. 如果您可以围绕问题div提供更多的html代码,我们可以构造一个适用于您的情况的jQuery选择器。

Update : Based on the markup provided 更新:基于提供的标记

function removeDiv() {

    var parent = document.getElementById("stimuli_overlay").parentNode;

    var children = document.getElementById("stimuli_overlay").parentNode.childNodes;

    for (var i = 0; i < children.length; i++) {

        if (children[i].style.zIndex == -1)
            parent.removeChild(children[i]);
    }


}

You could do something like this: 您可以执行以下操作:

var els = document.getElementsByTagName('div');
for (var i = 0; l = els.length; i < l; i++) {
  if (els[i].innerHTML == 'style....') {
    els[i].parentNode.removeChild(els[i]);
  }
}

Update : Based on the fact that you can't rely on the div used below. 更新 :基于您不能依赖下面使用的div的事实。

If the div really is the always the last div in the document, this is actually easier: 如果div实际上始终是文档中的最后一个div ,则实际上会更容易:

var divs, div;
divs = document.getElementsByTagName("div");
if (divs.length > 0) {
    div = divs.item(divs.length - 1);
    div.parentNode.removeChild(div);
}

Live example 现场例子

length - 1 will remove the last div in the document. length - 1将删除文档中的最后一个div。 If you needed to skip a lightbox div or something, adjust to use - 2 or - 3 , etc. 如果您需要跳过灯箱div或其他内容,请调整为使用- 2- 3等。

Old Answer using the earlier information: 使用较早信息的旧答案

Given that structure, something along these lines: 在这种结构下,遵循以下原则:

 // Get the div that follows it, which conveniently has an ID var div = document.getElementById('stimuli_overlay'); // If that worked... if (div) { // ...move to the previous div, with a bit of paranoia about blank non-element // nodes in-between div = div.previousSibling; while (div && (div.nodeType !== 1 || div.tagName !== "DIV")) { div = div.previousSibling; } // Check that this really is the right div if (div && div.tagName === "DIV" // The following checks look for some of the style properties that your // screenshot shows are set on the div && div.style.position == "absolute" && div.style.zIndex == "-1" && div.style.top == "0px" && div.style.left == "0px" && div.style.width == "100%" && /* ...possibly more checks here... */) { // Remove it div.parentNode.removeChild(div); } } 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM