簡體   English   中英

將類添加到javascript選擇器?

[英]Adding class to javascript selector?

createDocumentStructure('h3,.twistytext'); 是我遇到問題的那條線-最后一行。

如果我只有h3但也想添加一個類,它會起作用。 嘗試了多種不同的語法來編寫類語法,但沒有任何效果。 因此,我希望擴展/折疊為<div>然后為<h3 class="twistytext">

// JavaScript Document
var collapseDivs, collapseLinks;

function createDocumentStructure(tagName) {
    if (document.getElementsByTagName) {
        var elements = document.getElementsByTagName(tagName);
        collapseDivs = new Array(elements.length);
        collapseLinks = new Array(elements.length);
        for (var i = 0; i < elements.length; i++) {
            var element = elements[i];
            var siblingContainer;
            if (document.createElement && (siblingContainer = document.createElement('div')) && siblingContainer.style) {
                var nextSibling = element.nextSibling;
                element.parentNode.insertBefore(siblingContainer, nextSibling);
                var nextElement = elements[i + 1];
                while (nextSibling != nextElement && nextSibling != null) {
                    var toMove = nextSibling;
                    nextSibling = nextSibling.nextSibling;
                    siblingContainer.appendChild(toMove);
                }
                siblingContainer.style.display = 'none';
                collapseDivs[i] = siblingContainer;
                createCollapseLink(element, siblingContainer, i);
            } else {
                // no dynamic creation of elements possible
                return;
            }
        }
        createCollapseExpandAll(elements[0]);
    }
}

function createCollapseLink(element, siblingContainer, index) {
    var div;
    if (document.createElement && (div = document.createElement('div'))) {
        div.appendChild(document.createTextNode(String.fromCharCode(160)));
        var imge = document.createElement('img');
        imge.src = 'https://smartsales.thomsonreuters.com/library/template/cssfiles/gsam/expand.jpg';
        imge.setAttribute('width', '20px');
        imge.setAttribute('height', '20px');
        imge.setAttribute('class', 'imge')
        imge.alt = 'Expand';
        var link = document.createElement('a');
        link.collapseDiv = siblingContainer;
        link.href = '#';
        link.appendChild(imge);
        link.onclick = collapseExpandLink;
        //link.onclick = removediv;
        collapseLinks[index] = link;
        div.appendChild(link);
        element.appendChild(div);
    }
}

function collapseExpandLink(evt) {
    if (this.collapseDiv.style.display == '') {
        this.parentNode.parentNode.nextSibling.style.display = 'none';
        this.firstChild.alt = 'expand';
        this.firstChild.src = 'https://smartsales.thomsonreuters.com/library/template/cssfiles/gsam/expand.jpg';
    } else {
        this.parentNode.parentNode.nextSibling.style.display = '';
        var imgc = document.createElement('img');
        imgc.src = 'https://smartsales.thomsonreuters.com/library/template/cssfiles/gsam/collapse.jpg';
        imgc.setAttribute('width', '20px');
        imgc.setAttribute('height', '20px');
        imgc.setAttribute('class', 'imge')
        imgc.alt = 'Collapse';
        this.firstChild.src = 'https://smartsales.thomsonreuters.com/library/template/cssfiles/gsam/collapse.jpg';
        this.firstChild.alt = 'Collapse';
        // this.firstChild.setAttribute("src","collapse-eikon.jpg");
    }
    if (evt && evt.preventDefault) {
        evt.preventDefault();
    }
    return false;
}

function createCollapseExpandAll(firstElement) {
    var div;
    if (document.createElement && (div = document.createElement('div'))) {
        var link = document.createElement('a');
        link.setAttribute('class', 'expanderall');
        link.href = '#';
        link.appendChild(document.createTextNode('Expand all'));
        link.onclick = expandAll;
        div.appendChild(link);
        div.appendChild(document.createTextNode(' '));
        link = document.createElement('a');
        link.setAttribute('class', 'expanderall');
        link.href = '#';
        link.appendChild(document.createTextNode('Collapse all'));
        link.onclick = collapseAll;
        div.appendChild(link);
        firstElement.parentNode.insertBefore(div, firstElement);
    }
}

function expandAll(evt) {
    for (var i = 0; i < collapseDivs.length; i++) {
        collapseDivs[i].style.display = '';
        collapseLinks[i].firstChild.src = 'https://smartsales.thomsonreuters.com/library/template/cssfiles/gsam/collapse.jpg';
    }
    if (evt && evt.preventDefault) {

        evt.preventDefault();
    }
    return false;
}

function collapseAll(evt) {
    for (var i = 0; i < collapseDivs.length; i++) {
        collapseDivs[i].style.display = 'none';
        collapseLinks[i].firstChild.src = 'https://smartsales.thomsonreuters.com/library/template/cssfiles/gsam/expand.jpg';
    }
    if (evt && evt.preventDefault) {
        evt.preventDefault();
    }
    return false;
}

window.onload = function (evt) {
    createDocumentStructure('h3, .twistytext');
}

在你的職能

function createDocumentStructure(tagName) {

改成

function createDocumentStructure(tagName,className) {

然后在該函數中添加代碼

if(className)
{
   elements.className = className;
}

有關更多詳細信息,請參見使用JavaScript更改元素的類

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM