如何在javascript中选择父div的父级?
我有一个自定义的手风琴设置使用Javascript。当前使用onclick,我正在将一个样式切换到父div(当前持有一个“card”类并添加“card open”)。我的问题是,我如何更高一个div,并开始使用类“时间蒸汽事件”操纵div 实例: HTML:如何在javascript中选择父div的父级?,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我有一个自定义的手风琴设置使用Javascript。当前使用onclick,我正在将一个样式切换到父div(当前持有一个“card”类并添加“card open”)。我的问题是,我如何更高一个div,并开始使用类“时间蒸汽事件”操纵div 实例: HTML: <div class="time-stream-event" id="{entry_id}"> <div style="background: url({timeline_item_img}) no-repeat
<div class="time-stream-event" id="{entry_id}">
<div style="background: url({timeline_item_img}) no-repeat center center;" class="event-bg grayscale"></div>
<div class="card">
<h3><a href="{title_permalink="/timeline"}">{title}</a></h3>
<div class="event-year">{timeline_item_date format="%F %Y"}</div>
<a href="#" class="togglelink"></a>
<div class="toggle-box">
<p>{timeline_item_description}</p>
<div class="employees">Number of Employees</div>
<div class="employee-count-no"> <i class="ss-icon">👥</i> {timeline_item_employees}</div>
</div>
<div class="open-arrow"></div>
</div>
</div>
$.fn.slideFadeToggle = function(speed, easing, callback) {
return this.animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback);
};
$('.toggle-box').hide();
$('a.togglelink').on('click', function (e) {
e.preventDefault();
var elem = $(this).next('.toggle-box')
$('.toggle-box').not(elem).hide();
elem.slideFadeToggle();
var parent_div = $(this).parent().toggleClass('card-open');
});
您可以使用.closest()
或.parents()
:
或
你可以得到这样的结果:
var parent_div = $(this).parent().parent();
或:
如果您的div在层次结构(按级别)中处于第二位,您可以使用
var yourdiv = $(this).parent().parent();
或者,您也可以使用.closest()
var yourdiv = $(this).closest('.time-steam-event');
document.getElementsByClassName(“togglelink”)[0].parentElement代码>
这就是如何使用Javascript实现的
document.getElementsByClassName("togglelink")
返回具有“togglelink”类的元素数组。你需要得到确切的元素。如果只有一个元素,我的代码就可以了 尝试$(this).closest('.time-stream事件')代码>Try.parentElement它将根据您的DOM.document.getElementsByClassName(“togglelink”)[0]获取直接父级;因此,我在onclick中添加了以下内容,它不会切换类“.time stream event open”。我做错了什么?”var obj=$(this).closest('.time-steam事件');对象切换类('time-steam-event-open');'你能和大家分享一下这个问题吗?@DanLee:如果你能用相关代码创建这个问题就太好了。@DanLee:这个问题出了什么问题。在chrome上,切换看起来很好。
var yourdiv = $(this).parent().parent();
var yourdiv = $(this).closest('.time-steam-event');
document.getElementsByClassName("togglelink")