jQuery中的document.getElementById()替代 [英] document.getElementById() alternative in jQuery

问题描述

更新:对不起，我的线程被许多用户误解了.我会尝试更加清楚. 我正在使用Drupal，并且创建了三个浮动横幅.在首页上有一个块(block1)，其中显示一个浮动横幅，刷新后将显示第二个，第三个也显示. 就像写之前，这些横幅上有一个小的X按钮来阻止溢出. 我已将此脚本放在其中一个横幅中，并且效果很好.

UPDATE: I'm sorry that my thread was misinterpreted by many users. I'll try to be more clear. I'm using Drupal and I have created three floating banners. On the frontpage there is a block (block1) that displays one floating banner and after refresh the second one is appearing and for the third too. Like a wrote before these banners has a little X button to stop overflow. I've putted this script in a one of the banners and it's working great.

<script language="javascript">
function doexpand() {
    document.getElementById("block1").style.overflow = "visible";
}

function dolittle() {
    document.getElementById("block1").style.overflow = "hidden";
}    
</script>

真正的问题是在类别页面中我有#block2，在文章中有#block3. 这些块显示相同的横幅.上面的代码仅适用于一个ID.在这种情况下，#block1.正如我从其他主题中读到的那样，document.getElementById不适用于更多ID.

The real problem is that in categories pages I have #block2 and in articles #block3. These block are displaying the same banners. The code over is working only for a one ID. In this case #block1. document.getElementById is not working for more ID's as I read from other topics.

我已经尝试过使用带有两个块标识的jQuery:

I've tried with jQuery with two blocks idents like this:

(function ($) {

    function doexpand() {
     $("#block1,#block2").css("overflow","visible");
    }
    function dolittle() {
     $("#block1,#block2").css("overflow","hidden");
    }

    })(jQuery);

它不起作用. 萤火虫/控制台显示:ReferenceError:未定义doexpand.

It's not working. The firebug/console displays: ReferenceError: doexpand is not defined.

我也尝试过使用jQuery这样的单个块:

I've tried with a single block too with jQuery like this:

(function ($) {

        function doexpand() {
         $("#block1").css("overflow","visible");
        }
        function dolittle() {
         $("#block1").css("overflow","hidden");
        }

        })(jQuery);

，并且显示相同的错误.

and it's displaying the same error.

注意:Drupal具有不同的包装方式，就像这样:

Note: Drupal has a different wrapping and it's like this:

(function ($) {
        //your existing code
    })(jQuery);

推荐答案

请查看 jQuery选择器.

我认为在您的情况下，最好在CSS的帮助下将样式应用于多个元素.例如:

I think in your case, it is better to apply style with help of css for multiple elements. e.g. :

<script language="javascript">
function doexpand() {
    $('.block').style.overflow="visible";
}
function dolittle() {
    $('.block').style.overflow="hidden" ;
}
</script>

请向要应用此样式/功能的所有块添加class="block"，它将应用于css类为块"的所有块.

Please add class="block" to all of blocks for which you want to apply this style/function, it will apply on all of the blocks having css class "block".

这篇关于jQuery中的document.getElementById()替代的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！