原生javascript方法查询DOM对象是否隐藏

Question

<p class="answer-top" style=" display: none;">
        <a class="question-edit">Edit</a>
        <a class="clear">Clear</a>
        <a class="delete-finding">Delete</a>
</p>

上面代码如果通过原生的方法：document.querySelector('.question-edit').style.display无法查询该DOM对象是否隐藏

类似jquery有方法$('.question-edit').is(':hidden')来查询

原生DOM有方法实现吗，还是需要查找父节点一层层遍历？

补充：
有回答说用document.querySelector('.question-edit').style.display , 我已经写的很明显了，不行的。。单纯想通过使用style样式属性无法判断出来的，包括visibility，所以可以先看下题目的

Answer 1

IE:element.currentStyle
高端:window.getComputedStyle(element)
所以你需要以上两种方式，参考JQ的实现。

Answer 2

document.querySelector('.question-edit').style.display查的就是这个元素的这个属性值,display又不具有继承性,给父元素设置display:none,不代表子元素的display的值也被设置了,那么问题是你并没有给一个元素的display赋值,又怎么能查到该节点的display的值是否隐藏?
当然是display:none设置给谁才能用这个属性裁判这个元素是否隐藏.

jQuery( ":hidden" )能查到是因为这个方法设定之一就是在祖先元素是隐藏的，认为元素是不会在页面上显示。
你想用原生的写法,就相当于自己实现一个类似于jQuery的 is(':hidden')方法,可以去看看jQuery源码.或者查询父元素.

Answer 3

function isHidden(el) {
    return (el.offsetParent === null)
}

SO解答

Answer 4

只能一层一层向上查找了，递归调用，最后终止的条件是

document.querySelector('.question-edit').parentNode.parentNode.parentNode.parentNode === document  //true

楼上的方法

var q = document.querySelector('.question-edit');
window.getComputedStyle(q).d  //"none"