gpt4 book ai didi

javascript - 为什么我不能为我的数组设置一个 css 属性。 Hangman Javascript 编码

转载 作者:行者123 更新时间:2023-11-28 01:49:45 25 4
gpt4 key购买 nike

为什么 character.setAttribute() 不能工作。如果删除该行,则我试图完成的格式就在那里,但字母的 CSS 不会使其不可见。如果我确实放入了 setAttribute(),代码将不起作用。

<!Doctype html>
<html lang="en">
<head>
<style>
.hidden {
visibility: hidden;
}
ul {
display: inline;
list-style-type: none;
}

.boxes {
font-size:1.6em;
text-align:center;
width: 10px;
border-bottom: 3px solid black;
margin: 5px;
padding: 10px;
display: inline;
}
</style>
</head>
<body>
<script>

var possibleWord = ["cow", "better", "harder", "justify", "condemn",
"control", "hello", "understand", "life", "insight","date", "righteous"];
var hangmanWord = possibleWord[Math.floor(Math.random() *
possibleWord.length)];
var underlineHelp;
var space;
var guess;
var guesses = [];
var placement;
var underscores;
var character = [];
window.onload = function () {
placement = document.getElementById('hold');
underlineHelp = document.createElement('ul');
placement.appendChild(underlineHelp);
for (i = 0; i < hangmanWord.length; i++) {
underscores = document.createElement('li');
underscores.setAttribute('class', 'boxes');
guesses.push(underscores);
underlineHelp.appendChild(underscores);
character = document.createElement('li');
character = document.createTextNode(hangmanWord[i]);
character.setAttribute('class', 'hidden');//The issue is here, if you take
//this line out then the format will be correct, except I am trying to hide
//the letters with the css attribute "hidden."The dashes are represented by
//the bottom-border of "boxes."
underscores.appendChild(character);
}
</script>
<div id = "hold"></div>
</html>

最佳答案

TextNode 没有属性。

character = document.createElement('li');
character = document.createTextNode(hangmanWord[i]);

我猜你想做的是:

character = document.createElement('span');
character.appendChild(document.createTextNode(hangmanWord[i]));
character.classList.add('hidden');
underscores.appendChild(character);

工作示例:

var possibleWord = ["cow", "better", "harder", "justify", "condemn",
"control", "hello", "understand", "life", "insight", "date", "righteous"
];
var hangmanWord = possibleWord[Math.floor(Math.random() *
possibleWord.length)];
var underlineHelp;
var space;
var guess;
var guesses = [];
var placement;
var underscores;
var character = [];
window.onload = function() {
placement = document.getElementById('hold');
underlineHelp = document.createElement('ul');
placement.appendChild(underlineHelp);
for (i = 0; i < hangmanWord.length; i++) {
underscores = document.createElement('li');
underscores.setAttribute('class', 'boxes');
guesses.push(underscores);
underlineHelp.appendChild(underscores);
character = document.createElement('span');
character.appendChild(document.createTextNode(hangmanWord[i]));
character.classList.add('hidden');
underscores.appendChild(character);
}
}
 .hidden {
visibility: hidden;
}

ul {
display: inline;
list-style-type: none;
}

.boxes {
font-size: 1.6em;
text-align: center;
width: 10px;
border-bottom: 3px solid black;
margin: 5px;
padding: 10px;
display: inline;
}
  <div id="hold"></div>

关于javascript - 为什么我不能为我的数组设置一个 css 属性。 Hangman Javascript 编码,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50011776/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com