我是否正确使用此脚本？

-3

我是新来使用JavaScript。我是否正确使用以下脚本？我是否正确使用此脚本？

function func() { 
 
    document.getElementById('div1').style.display = 'block' 
 
    document.getElementById('div2').style.display = 'none' 
 
    document.getElementById('div3').style.display = 'none' 
 
    if ("div1") { 
 
    document.getElementById('div1').style.display = 'block' 
 
    document.getElementById('div2').style.display = 'none' 
 
    document.getElementById('div3').style.display = 'none' 
 
    } 
 
    if ("div2") { 
 
    document.getElementById('div1').style.display = 'none' 
 
    document.getElementById('div2').style.display = 'block' 
 
    document.getElementById('div3').style.display = 'none' 
 
    } 
 
    if ("div3") { 
 
    document.getElementById('div1').style.display = 'none' 
 
    document.getElementById('div2').style.display = 'none' 
 
    document.getElementById('div3').style.display = 'block' 
 
    } 
 
}

<ul> 
 
    <li><a class="active" href="#home" func()="div1">Home</a> 
 
    </li> 
 
    <li><a href="#SubmitNewRequest" func()="div2">Submit new request</a> 
 
    </li> 
 
    <li><a href="#SearchExisting" func()="div3">Search existing requests</a> 
 
    </li> 
 
</ul>

来源

2016-01-22 codenoob

请格式化你的代码更易读。你的问题到底是什么？ –

对不起，我对这个网站很陌生。我想知道这段代码是否写得正确。 – codenoob

简短的答案是@codenoob，它不是。我正在研究解决其面临的问题的很大一部分的答案;挂紧。 –

有几件事情：

HTML标签都有一个名称（如 '一' 或 '格'），并可以有属性（如“身份证'，'href'等）。属性是键值对（如id="croissant"或href="#head"）
假设您意图让用户点击链接来显示/隐藏div，您需要在锚点上使用onclick属性元件。
```
# INCORRECT 
func()="div1" 

# CORRECT 
onclick="func('div1')" 
```
JavaScript函数需要采取的参数，这样就可以在函数调用发送信息（div的名称，在这种情况下）
的该func if语句JavaScript的内代码应评估为布尔条件：true或false。

基于这些，我已经调整了你给出的代码示例，以便它可以工作;点击“运行代码片段”以查看它的实际运行情况。这不一定是生产代码，但是这应该更好地说明应该考虑的不同组件。

function func(div) { 
 
    document.getElementById('div1').style.display = 'none' 
 
    document.getElementById('div2').style.display = 'none' 
 
    document.getElementById('div3').style.display = 'none' 
 
    if (div == "div1") { 
 
    document.getElementById('div1').style.display = 'block' 
 
    } 
 
    if (div == "div2") { 
 
    document.getElementById('div2').style.display = 'block' 
 
    } 
 
    if (div == "div3") { 
 
    document.getElementById('div3').style.display = 'block' 
 
    } 
 
}

#div1 { 
 
    display:none; 
 
} 
 
#div2 { 
 
    display:none; 
 
} 
 
#div3 { 
 
    display:none; 
 
}

<ul> 
 
    <li><a class="active" href="#home" onclick="func('div1')">Home</a></li> 
 
    <li><a href="#SubmitNewRequest" onclick="func('div2')">Submit new request</a></li> 
 
    <li><a href="#SearchExisting" onclick="func('div3')">Search existing requests</a></li> 
 
</ul> 
 

 
<div id="div1">Content A</div> 
 
<div id="div2">Content B</div> 
 
<div id="div3">Content C</div>

来源

2016-01-22 21:33:44

太棒了。这正是我需要的。谢谢！ – codenoob

我是否正确使用此脚本？

回答

相关问题