Javascript：如果满足条件，则隐藏元素_Javascript_Html

Javascript：如果满足条件，则隐藏元素

javascript html

Javascript：如果满足条件，则隐藏元素,javascript,html,Javascript,Html,我试图根据元素的ID隐藏元素，但是，我无法让它工作。我用谷歌搜索了答案，但不管我做什么，我似乎都无法让它对我起作用我的代码附在下面 <!DOCTYPE html> <html>  <body> <div id="role" value="Edit"> <button> Edit </button> </div

我试图根据元素的ID隐藏元素，但是，我无法让它工作。我用谷歌搜索了答案，但不管我做什么，我似乎都无法让它对我起作用

我的代码附在下面

<!DOCTYPE html>
<html>
    <!-- HTML -->
    <body>
        <div id="role" value="Edit">
            <button> Edit </button>
        </div>
    </body>

    <!-- Javascript -->
    <script>
        if(document.getElementById("role").value == 'Edit'){
            document.getElementById("role").style.display = 'none';
        }
    </script>
</html>


编辑
if（document.getElementById（“角色”）.value==“编辑”）{
document.getElementById（“角色”）.style.display='none'；
}

您试过这个吗

<!DOCTYPE html>
<html>
<!-- HTML -->
<body>
    <div id="role" value="Edit">
        <button> Edit </button>
    </div>
</body>

<!-- Javascript -->
<script>
    if(document.getElementById("role").getAttribute('value') == 'Edit'){
        document.getElementById("role").style.display = 'none';
    }
</script>


编辑
if（document.getElementById（“角色”）.getAttribute（“值”）==“编辑”）{
document.getElementById（“角色”）.style.display='none'；
}

您可以使用下面的代码，您希望获得的是属性而不是值

如果需要，可以使用querySelector而不是getElementById

var-role=document.querySelector（“#role”）；
if（role.getAttribute（'value'）=='Edit'）{
role.style.display='none'；
}


编辑

在您的示例

文档中。getElementById（“角色”）。值

未定义。要检索属性值，应使用

element.getAttribute（'attr'）

方法或

element.attributes[attr].value

在您的情况下，它将是

document.getElementById（“角色”）.attributes['value'].value

当您想要隐藏时，请在单击按钮时询问清楚的问题？或者你到底想要什么根据这一点，document.getElementById（“role”）.value只能在它是一个输入字段的情况下使用。这很有效！我会尽快接受答案。