将类添加到 javascript 选择器?
2014-06-25
147
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');
}
1个回答
在您的函数中
function createDocumentStructure(tagName) {
更改为
function createDocumentStructure(tagName,className) {
并在该函数中添加代码
if(className)
{
elements.className = className;
}
有关更多详细信息,请参阅 使用 JavaScript 更改元素的类
rjdmello
2014-06-25