- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我在这里看到了几个关于此错误的问题,并且在看到一些答案后我注意到普遍的共识是它是由于尚未创建 DOM 而引起的。我尝试了几种不同的解决方案来修复它,例如将我的脚本移动到标签之前,在创建图像之前和之后使用日志输出以确保实际上正确创建了对象,但没有解决我的问题。我是 Javascript 的新手,所以我可能明显遗漏了什么?
var dice = [6, 6, 6, 6, 6];
function rollDice() {
for (var i = 0; i < dice.length; ++i) {
var num = Math.floor(Math.random() * 6 + 1);
dice[i] = 1;
document.write(dice[i] + "<br>");
}
for (var i = 0; i < dice.length; ++i) {
var value = dice[i];
var path;
var ArrayImage = ["images/dice 1.png", "images/dice 2.png", "images/dice 3", "images/dice 4.png", "images/dice 5.png", "images/dice 6.png"];
path = ArrayImage[value];
}
document.getElementById("dice_1").setAttribute("src", path)
}
<html>
<head>
<meta charset="utf-8">
<title>Project 1</title>
<link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>
<h1> This is a javascript application</h1>
<script>
console.log("script #1: %o", document.getElementById("dice_1")); // null
</script>
<div>
<img id="dice_1" src="images/dice 1.png">
<img id="dice_2" src="images/dice 1.png">
<img id="dice_3" src="images/dice 1.png">
<img id="dice_4" src="images/dice 1.png">
<img id="dice_5" src="images/dice 1.png">
</div>
<input id="but" type="button" onclick="rollDice()" value="Roll Dice.">
<script>
console.log("script #1: %o", document.getElementById("dice_1")); // null
</script>
<script type="text/javascript" src="scripts/script.js"></script>
</body>
</html>
最佳答案
由于您在文档加载后使用 document.write,它会清除整个文档(由于调用了 document.open())。因此,您的 img 元素不存在,无法针对它们运行 setAttribute。请尝试以下操作(请注意由于数组索引从零开始而需要进行的索引更正):
var dice = [6,6,6,6,6];
var results;
var resultsContainer = document.querySelector('.results');
function rollDice(){
// clear results array
results = [];
for(var i =0; i<dice.length; ++i){
var num = Math.floor(Math.random()*6 +1);
dice[i] = num;
results.push(dice[i]);
}
for(var i =0; i< dice.length; ++i){
var value = dice[i];
var path;
var ArrayImage = ["images/dice 1.png", "images/dice 2.png", "images/dice 3.png", "images/dice 4.png", "images/dice 5.png", "images/dice 6.png"];
path = ArrayImage[value - 1];
document.getElementById("dice_"+ (i + 1)).setAttribute("src",path);
}
// convert results array to text with <br> between them
var resultsStr = results.join("<br>");
// display results as text to page
resultsContainer.innerHTML = resultsStr;
}
关于javascript - 无法读取 null 的属性 'setAttribute' - Javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54240953/
request.setAttribute 和 request.getSession().setAttribute() 有什么区别? 它们存储在哪里以及以什么格式? 最佳答案 区别: 当您使用reque
session.setAttribute 和 request.setAttribute 有什么区别? 最佳答案 范围,session属性住所有的session而request属性只在一个请求中 关于j
我一直热衷于重置我的一个 jsp 页面上的一些验证错误。这是一个我无法再联系到的人(死亡或无法联系)继承的项目。我有一个 jsp 页面,其中包含许多自定义标记库,其中更多页面被添加为选项卡,父页面具有
当您从请求和 getServletContext() 调用它们时,get/setAttribute() 之间有什么区别。我注意到你需要 RequestDispatcher rd = request.g
所以我正在学习操作 DOM,并且我注意到一件有趣的事情: 假设我想使用“.”设置元素的 name 属性。点符号: element.name = "someName"; console.log(docu
HttpServletRequest类的setAttribute()方法和HttpSession类的setAttribute()方法有什么区别? 在什么情况下使用? 最佳答案 一个在请求范围内设置一个
为什么我们要使用setAttribute()方法来设置ServletContext参数,因为我们可以通过在web.xml中设置参数并使用getInitParameter()来获取它们来完成相同的工作?
我在 setAttribute() 方面遇到问题。我已经搜索过互联网和这个网站,但他们没有解决我的问题。我想用 javascript 更改图片的宽度和高度,但它不起作用。请帮助我。
在学校,我的老师将我的代码更改为下面的示例它不起作用,我无法理解它是如何工作并修复它的。 function _$(e, attrs) { var el = document.createEle
我有三个元素,我正在尝试为每个元素设置属性: const foldable = document.getElementsByClassName('foldable') let result = Arr
我正在尝试使用 object3D.lookAt 属性更改图像的视角。目前我正在尝试使用组件的 update() 方法更改图像的方向。这是通过更新我的组件的 Lookat 属性来实现的。 functio
我有一些有效的 SVG 代码,可以通过在形状上设置属性来处理鼠标事件: function plot() { ... shape.setAttributeNS(null, "onmouseove
我使用的表单会根据您单击单选按钮的选项来显示一些 div。 问题是 div 设置为不显示,除非我选择一个选项。 所以我添加了以下函数,以确保如果显示 div,它将具有具有所需属性的形式。 所以我给出这
此代码嵌套在 ascx 控件中。 onclientclick 事件有效并且没有错误,但标签文本没有更改?我错过了什么?
同样,我在使用 setAttribute 时遵循我的引用书和在线引用:它根本不起作用; HTML:
这是一些 HTML: lorem Lorem, ipsum dolor sit amet consectetur adipisicing elit. Eaque magnam expedit
我一直在以不同的方式创建元素,但不确定最佳方法。有什么区别: var myselect = document.createElement("select"); myselect.name="blah"
这里我稍微修改了代码 https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_doc_getelementsbyname_loop 来自
我在为另一个元素设置属性时遇到问题。 我正在使用带有 JS 和 HTML 的 PHP 代码,它看起来像: $value 你一定知道我有两个元素。我用于编写文本的第一个('content')和另一个('
我是 Javascript 的新手,我不知道如何在选定的选项上使用 setAttribute。 我的 html 中有一个 id = employee 的 select 元素(使用 javascript
我是一名优秀的程序员,十分优秀!