[英]Take attribute value from where style display is not none
I have few divs: 我有几个div:
<div clas="modal-body step step-1" data-step="1" style="display: block;"></div>
<div clas="modal-body step step-2" data-step="2" style="display: none;"></div>
<div clas="modal-body step step-3" data-step="3" style="display: none;"></div>
I would like to get the value of attribute "data-step"
where style: display
is not none
. 我想要获得
style: display
不是none
的属性"data-step"
的值。
Is it possible with JavaScript or JQuery? JavaScript或JQuery是否可能?
You can use the :visible selector in jQuery. 您可以在jQuery中使用:visible选择器。 This will create a node list (like the querySelectorAll that will contain only the item /s that is not hidden. Then you can get the data-step value of that element.
这将创建一个节点列表(例如querySelectorAll,它将仅包含未隐藏的/ s项。然后,您可以获取该元素的数据步长值。
let visibleStep =$(".step:visible"); console.log(visibleStep.attr('data-step')); // gives 1
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="wathever"> <div class="modal-body step step-1" data-step="1" style="display: block;">A</div> <div class="modal-body step step-2" data-step="2" style="display: none;">B</div> <div class="modal-body step step-3" data-step="3" style="display: none;">C</div> </div>
I just did some sketch on fiddle, try it and let me know if is what you need sir. 我只是在小提琴上做了一些草图,尝试一下,让我知道您是否需要先生。 This is a pure javascript solution.
这是一个纯JavaScript解决方案。
let nodeList = document.getElementById("wathever").querySelectorAll(".step"); nodeList.forEach(function(div){ if(div.style.display!="none"){ //do something let dataStep = div.dataset.step; console.log(dataStep); } });
<div id="wathever"> <div class="modal-body step step-1" data-step="1" style="display: block;">A</div> <div class="modal-body step step-2" data-step="2" style="display: none;">B</div> <div class="modal-body step step-3" data-step="3" style="display: none;">C</div> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.