小＆＃34; o＆＃34;在Firefox中没有任何地方

Question

我试图在底部创建一个带有表格的javascript横幅。但是，Firefox将此添加到我的html中

对于明显愚蠢的问题感到抱歉，但我无法获得足够的信息来谷歌这个。

＆＃13;

＆＃13;

$(document).ready(function(){
    $('.pageTable td').css('background-image', "url('./Portals/_default/skins/singapore_academy_of_law/images/bannerRightArrow.png')");
    $('.bannerContainer').css('background-image', "url('./Portals/0/Images/Home/bannerBackground.png')");
    $('.bannerIconCombo').click(function(){ 
        $('.bannerPages').hide();
        $('.bannerIconCombo').css('background-image', '');
    });
    
    $('.bannerIconCombo1').click(function(){ 
        $('.bannerPage1').show();
        $('.bannerIconCombo1').css('background-image', 'url("./Portals/_default/skins/singapore_academy_of_law/images/bannerIconCombo1.png")');
    });
    
    $('.bannerIconCombo2').click(function(){ 
        $('.bannerPage2').show();
        $('.bannerIconCombo2').css('background-image', 'url("./Portals/_default/skins/singapore_academy_of_law/Images/bannerIconCombo2.png")');
    });
    
    $('.bannerIconCombo3').click(function(){ 
        $('.bannerPage3').show();
        $('.bannerIconCombo3').css('background-image', 'url("./Portals/_default/skins/singapore_academy_of_law/Images/bannerIconCombo3.png")');
    });
    
    $('.bannerIconCombo4').click(function(){ 
        $('.bannerPage4').show();
        $('.bannerIconCombo4').css('background-image', 'url("./Portals/_default/skins/singapore_academy_of_law/Images/bannerIconCombo4.png")');
    });
    $('.closeBannerPage').click(function(){ 
        $('.bannerPages').hide();
        $('.bannerIconCombo').css('background-image', '');
    });
});

＆＃13;

.bannerIconTable {
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    margin: 0;
    border-collapse: collapse;
}
.bannerIconTable tr {
    height: 100%;
    padding: 0;
    border: 0;
    margin: 0;
}
.bannerIconTable td {
    width: 25%;
    height: 100%;
    padding: 0;
    border: 0;
    margin: 0;
    display: inline-block;
    cursor: pointer;
    text-align: center;
    vertical-align: top;
}
.bannerIcons {
    display: inline-block;
}
.bannerIconTitles {
    display: inline-block;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<table class="bannerIconTable">
                <tbody><tr>
                    <td>
                        <div class="bannerIconCombo bannerIconCombo1">
                            <div class="bannerIcons bannerIcon1">
                                <img src="http://10.10.10.35/Portals/0/Images/Home/intro4.png?ver=2017-05-14-180732-060" alt="intro4.png">
                            </div>
                            <div class="bannerIconTitles bannerIconTitle1">
                                Creating Knowledge
                            </div>
                        </div>
                    </td>
                    <td>
                        <div class="bannerIconCombo bannerIconCombo2">
                            <div class="bannerIcons bannerIcon2">
                                <img src="http://10.10.10.35/Portals/0/Images/Home/intro3.png?ver=2017-05-14-181407-780" alt="intro3.png">
                            </div>
                            <div class="bannerIconTitles bannerIconTitle2">
                                Catalysing Ideas
                            </div>
                        </div>
                    </td>
                    <td>
                        <div class="bannerIconCombo bannerIconCombo3">
                            <div class="bannerIcons bannerIcon3">
                                <img src="http://10.10.10.35/Portals/0/Images/Home/intro2.png?ver=2017-05-14-181904-640" alt="intro2.png">
                            </div>
                            <div class="bannerIconTitles bannerIconTitle3">
                                Capability Building
                            </div>
                        </div>
                    </td>
                    <td>
                        <div class="bannerIconCombo bannerIconCombo4">
                            <div class="bannerIcons bannerIcon4">
                                <img src="http://10.10.10.35/Portals/0/Images/Home/intro1.png?ver=2017-05-14-180718-513" alt="intro1.png">
                            </div>
                            <div class="bannerIconTitles bannerIconTitle4">
                                Connecting Community
                            </div>
                        </div>
                    </td>
                </tr>
            </tbody></table>

＆＃13;

＆＃13;

＆＃13;

Answer 1

//clean DOM for elements created by tabs (using tabs creates a certain whitespace in the document
//below can be used to clean
$.fn.clean = function(node)
{
    for (var n = 0; n < node.childNodes.length; n++)
    {
        var child = node.childNodes[n];

        if (child.nodeType === 8 || (child.nodeType === 3 && !/\S/.test(child.nodeValue))) {
            node.removeChild(child);
            n --;
        } else if (child.nodeType === 1) {
            $.fn.clean(child);
        }
    }
};

然后你可以这样做：$.fn.clean(document);

某些空格会在浏览器中创建这些奇怪的节点，这会修复它们。