如果...否則，則使用Javascript更改元素ID
[英]Change Element Id with Javascript, if…else if…else
問題描述
我正在嘗試創建一個if ... else if ... else參數，其中唯一的變量是當前訪問級別編號。 這將確定要顯示給用戶的內容，以便級別1的人看到一件事，而級別0的人看到另一件事。
默認情況下，所有內容都是隱藏的，但是一旦有人訪問了網頁，就應該使用Javascript更改元素的ID以顯示適當的內容。 我不太確定自己在做什么錯，但是並沒有按要求更改ID。 如果我使用錯誤的方法，請告訴我可能還有其他替代方法。
<html>
<body>
<style type="text/css">
#AccessLevel1Hide {display: none; }
#AccessLevel1Show {display: block; }
#AccessLevel0Hide {display: none; }
#AccessLevel0Show {display: block; }
</style>
<script type="text/javascript">
var AccessLevel = (1);
if (AccessLevel == 1){
document.getElementById('AccessLevel1Hide').id="AccessLevel1Show";
}else if (AccessLevel == 0){
document.getElementById('AccessLevel0Hide').id="AccessLevel0Show";
}else {document.write("ERROR");
}
</script>
<div id="AccessLevel1Hide">
Access Level 1 message.
</div>
<div id="AccessLevel0Hide">
Access Level 0 message.
</div>
</body>
</html>
5 個解決方案
解決方案1
2 2010-09-10 00:36:33
使用一個類要容易得多，如下所示：
參見http://jsfiddle.net/hJ6gd/8/
<html>
<body>
<style type="text/css">
.hide {display: none; }
.show {display: block; }
</style>
<script type="text/javascript">
var AccessLevel = (1);
if (AccessLevel == 1){
document.getElementById('AccessLevel1').setAttribute("class", "show");
}else if (AccessLevel == 0){
document.getElementById('AccessLevel0').setAttribute("class", "show");
}else {document.write("ERROR");
}
</script>
<div id="AccessLevel1" class="hide">
Access Level 1 message.
</div>
<div id="AccessLevel0" class="hide">
Access Level 0 message.
</div>
</body>
</html>
但是，應該注意，這一點也不安全-他們要做的就是查看源代碼以查看所有內容。
解決方案2
1 2010-09-10 00:38:25
我以前從未嘗試過更改元素ID，但不確定是否有意義。 您應該使用類而不是ID來執行此操作，因此您的CSS是.AccessLevel1Hide等，然后更改類。
但是真正的問題是信任客戶端/瀏覽器。 我可以更改訪問級別，或者只是查看頁面源代碼，並查看每個訪問級別的所有內容。
這些檢查應在服務器端進行，並且僅將適當的內容傳遞給瀏覽器。
解決方案3
0 2010-09-10 00:35:46
當您將AccessLevel1Hide更改為AccessLevel0Hide時，第二個getElementById將獲取第一個div（在第一步中已為其更改ID。）
因此，您需要做的是將AccessLevel1Hide更改為AccessLevelTempHide ，將AccessLevel0Hide更改為AccessLevel1Hide，然后將AccessLevelTempHide更改為AccessLevel0Hide 。
我建議您使用CSS類，而不要更改ID。
解決方案4
0 2010-09-10 00:37:24
我相信更好的方法是保留ID的靜態狀態並添加一個更改的類。 或者，您也可以只更改每個元素的.style.display ，而不是id。
解決方案5
0 2010-09-10 00:41:27
我認為您應該使用style.display屬性
if (AccessLevel == 1){
document.getElementById('AccessLevel1Hide').style.display = "block";
document.getElementById('AccessLevel0Hide').style.display = "none";
}else if (AccessLevel == 0){
document.getElementById('AccessLevel1Hide').style.display = "none";
document.getElementById('AccessLevel0Hide').style.display = "block";
}else {document.write("ERROR");
}
在javascript中使用if/else更改圖像或背景ID大小
[英]Using if / else to change image or background id size in javascript
Javascript if-else if內部開關使用（“ #id”）。length
[英]Javascript if - else if inside switch using (“#id”).length
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.