我在我的网站上显示MailChimp简报的存档，其输出格式为：
<div class="display_archive">
<div class="campaign">
04/29/2016 - <a href="#" target="_blank" title="TITLE HERE">TITLE HERE</a>
</div>
<div class="campaign">
03/24/2016 - <a href="#" target="_blank" title="TITLE HERE">TITLE HERE - March 2016</a>
</div>
</div>
我想隐藏日期，我相信会隐藏div .campaign a之前的内容。我怎样才能做到这一点？谢谢你的帮助。
答案 0 :(得分：2)
由于日期位于文本节点中，您可以使用content()来检索它。如果您可以保证它始终是.campaign元素中的第一个孩子，那么您可以使用.first()然后使用remove()，如下所示：
$('.campaign').each(function() {
$(this).contents().first().remove();
})
这将完全从DOM中删除元素。如果您只想隐藏视图中的元素，可以将其包装在span中并在该元素上设置display: none：
$('.campaign').each(function() {
$(this).contents().first().wrap('<span />');
})
.campaign span {
display: none;
}
答案 1 :(得分：0)
您可以执行此操作来隐藏日期。
<div class="display_archive">
<div class="campaign">
<span style="display: none;">04/29/2016 - </span>
<a href="#" target="_blank" title="TITLE HERE">TITLE HERE</a>
</div>
<div class="campaign">
<span style="display: none;">03/24/2016 - </span>
<a href="#" target="_blank" title="TITLE HERE">TITLE HERE - March 2016</a>
</div>
</div>
您也可以使用style="visibility: hidden"。
答案 2 :(得分：0)
使用纯JavaScript的一种方法如下：虽然这种方法确实要求隐藏的兄弟节点是直接previousSibling：
function hidePrevious(opts) {
// setting up the defaults:
var settings = {
// no default 'start' element (the element(s) before
// which you wish to hide the previousSibling):
'start': null,
// defaulting to wrapping the previousSibling (if
// it isn't already wrapped in an element):
'wrap': true,
// what to wrap with:
'wrapWith': 'span'
},
// empty variables for later use:
wrapper,
prev,
startPoints;
// iterating through the keys of the opts object, if
// set; otherwise using an empty Object to avoid
// errors:
Object.keys(opts || {}).forEach(function(key) {
// updating the settings property with the
// property value of the opts Object:
settings[key] = opts[key];
});
// if settings.start is a String:
if (typeof settings.start === 'string') {
// we pass that String to document.querySelectorAll(),
// then use Array.prototype.slice() to convert the
// collection into an Array (since Array.from() doesn't
// work in my at-work computer, sadly):
startPoints = Array.prototype.slice.call(document.querySelectorAll(settings.start), 0);
// otherwise, if the settings.length property-value has a
// length property, or is an instanceof a NodeList:
} else if (settings.length || settings.start instanceof NodeList) {
// we directly turn that NodeList or Array into an Array
// (no damage except wasted time if it's already an Array):
startPoints = Array.prototype.slice.call(settings.start, 0);
}
// iterating over the Array of nodes:
startPoints.forEach(function(el) {
// creating an element equal to either that set in the
// settings.wrapWith property-value, or using the
// node's own localName (the tagName, but in lower-case):
wrapper = document.createElement(settings.wrapWith || el.localName);
// assigning the previousSibling of the current element to
// the prev variable:
prev = el.previousSibling;
// we should wrap the previousSibling (settings.wrap === true),
// and we have a previousSibling and that previousSibling is a
// textNode (nodeType === 3):
if (settings.wrap === true && prev && prev.nodeType === 3) {
// we insert the wrapper ahead of the previousSibling:
prev.parentNode.insertBefore(wrapper, prev);
// move the previousSibling into the wrappper:
wrapper.appendChild(prev);
// update the style of the wrapper element to hide it:
wrapper.style.opacity = 0;
wrapper.style.backgroundColor = 'transparent';
wrapper.style.color = 'transparent';
// otherwise, if we must still wrap, and we still have a
// previousSibling and that previousSibling is an
// HTMLElementNode (nodeType === 1):
} else if (settings.wrap === true && prev && prev.nodeType === 1) {
// we simply style that previous element:
prev.style.opacity = 0;
prev.style.backgroundColor = 'transparent';
prev.style.color = 'transparent';
} else {
// otherwise we assign the trimmed text of the
// previousSibling to the current element using
// a custom data-* property:
el.dataset.previoustextcontent = prev.nodeValue.trim();
// and directly remove the previousSibling:
prev.parentNode.removeChild(prev);
}
});
}
hidePrevious({
'start': document.querySelectorAll('.campaign a'),
'wrapWith': 'b'
});
function hidePrevious(opts) {
var settings = {
'start': null,
'wrap': true,
'wrapWith': 'span'
},
wrapper,
prev,
startPoints;
Object.keys(opts || {}).forEach(function(key) {
settings[key] = opts[key];
});
if (typeof settings.start === 'string') {
startPoints = Array.prototype.slice.call(document.querySelectorAll(settings.start), 0);
} else if (settings.length || settings.start instanceof NodeList) {
startPoints = Array.prototype.slice.call(settings.start, 0);
}
startPoints.forEach(function(el) {
wrapper = document.createElement(settings.wrapWith || el.localName);
prev = el.previousSibling;
if (settings.wrap === true && prev && prev.nodeType === 3) {
prev.parentNode.insertBefore(wrapper, prev);
wrapper.appendChild(prev);
wrapper.style.opacity = 0;
wrapper.style.backgroundColor = 'transparent';
wrapper.style.color = 'transparent';
} else if (settings.wrap === true && prev && prev.nodeType === 1) {
prev.style.opacity = 0;
prev.style.backgroundColor = 'transparent';
prev.style.color = 'transparent';
} else {
el.dataset.previoustextcontent = prev.nodeValue.trim();
prev.parentNode.removeChild(prev);
}
});
}
hidePrevious({
'start': document.querySelectorAll('.campaign a'),
'wrapWith': 'b'
});<div class="display_archive">
<div class="campaign">
04/29/2016 - <a href="#" target="_blank" title="TITLE HERE">TITLE HERE</a>
</div>
<div class="campaign">
<em>03/24/2016 -</em><a href="#" target="_blank" title="TITLE HERE">TITLE HERE - March 2016</a>
</div>
<div class="campaign">
<em>02/24/2016 -</em><a href="#" target="_blank" title="TITLE HERE">TITLE HERE - February 2016</a>
</div>
</div>