javascript - 无法使用 javascript 抓取和操作 HTML 元素

标签 javascript html css

let button = document.getElementsByTagName('button');
button.value = 8;

//button.textCont = 'X'; --- DOESN'T WORK.
//button.innerHTML = 'X'; --- DOESN'T WORK.
body {
	background-color: coral;
}

h1 {
	font-family: 'monospace';
	text-align: center;
}

button {
	width: 100px;
	height: 100px;
	position: relative;
	left: 35px;
	top: 35px;
	background-color: coral;
	border: none;
	margin: 4px;
}


.game-box {
	background-color: black;
	width: 400px;
	height: 400px;
	border-radius: 10%;
	margin: auto;

}

.shave-left-top {
	border-top-left-radius: 10%;
}

.shave-right-top {
	border-top-right-radius: 10%;
}

.shave-left-bottom {
	border-bottom-left-radius: 10%;
}

.shave-right-bottom {
	border-bottom-right-radius: 10%;
}
<!DOCTYPE html>
<html>
<head>
	<title>javaScript Tic Tac Toe</title>
	<link rel="stylesheet" type="text/css" href="style.css">
	<meta charset="utf-8">
</head>
<body class="wrapper">
	<h1>javascript Tic Tac Toe</h1>

	<div class="game-box">
		<div class="row-1">
			<button class="shave-left-top"></button> 
			<button ></button> 
			<button class="shave-right-top"></button> 
		</div>

		<div class="row-2">
			<button></button> 
			<button></button> 
			<button></button> 
		</div>

		<div class="row-3">
			<button class="shave-left-bottom"></button> 
			<button></button> 
			<button class="shave-right-bottom"></button> 
		</div>

	</div>
<script type="text/javascript" src="script.js"></script>
</body>
</html>

大家好,不知道怎么回事。似乎无法用我的 JS 获取和更改按钮值,我的控制台中确实有一个错误:SCRIPT7002:XMLHttpRequest:网络错误 0x80700013,http://download.microsoft.com/download/B/9/F/B9FF9327-7A72-4165-BF91-9B7EEB6C579B/DeviceList.json

我下载了这个但它什么也没做,然后错误又出现了。在这方面有什么帮助吗?我在制作 JS 计算器时遇到了同样的问题。我什至张贴了它,但找不到答案。如果有帮助,我正在为我的浏览器使用 Sublime 3 和 edge。谢谢。

最佳答案

let button = document.getElementsByTagName('button');

getElementsByTagName 返回带有名称按钮的所有标签的数组。

要解决这个问题,如果只有一个按钮,请更改数组第一个索引处的第一个元素

   button[0].value = 8;
   button[0].textCont = 'X';
   button[0].innerHTML = 'X';

或遍历数组并更改每个按钮的属性。

for(var i = 0; i < button.length; i++)
{
   button[i].value = 8;
   button[i].textCont = 'X';
   button[i].innerHTML = 'X';
}

关于javascript - 无法使用 javascript 抓取和操作 HTML 元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51462076/

相关文章:

javascript - 你能对一个 div 有超过 1 个 jquery 效果吗?

JavaScript 未在 Canvas 上绘图

html - 如何让输入不影响后台?

css - font-size 0 仍然出现在 IE7 中

javascript - 一旦 View 被破坏,删除附加到窗口范围的事件的更干净的方法

javascript - 将 $scope 放在 Cytoscape 点击事件中

javascript - 使用js在svg中的rect标签内画一个复选标记

jquery - show 从 Div 隐藏内容,默认先显示

html - 在jsp中对齐img和输入

javascript - jQuery 函数问题