- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
废话:这是一项作业,我需要使用 JavaScript 创建和操作 hr 标签。我需要在开始正文标记之后直接插入 .js 文件。
问题:我无法应用 hr 的 width 属性。
我尝试过 setAttribute() 和 .style.width = blah。两者都没有为我工作。我哪里出错了?
function headerFunction() {
var h1 = document.getElementById('h1');
h1.innerHTML = "L. Name";
h1.style.color = "red";
h1.style.fontFamily = "Tahoma";
h1.setAttribute("align", "center");
var h2 = document.getElementById('h2');
h2.innerHTML = "WEB 101.0001";
h2.style.color = "red";
h2.style.fontFamily = "Garamond";
h2.setAttribute("align", "center");
h2.style.fontStyle = "italic";
var h3 = document.getElementById('h3');
h3.innerHTML = "Build Your Resume";
h3.setAttribute("align", "center");
var newElem = document.createElement("HR");
var hR = document.getElementById('header');
hR.insertBefore(newElem, hR.childNodes[4]);
var hrule = document.getElementsByTagName("HR");
hrule.setAttribute("width", "60%");
}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" src="finalCSS.css">
<title>Web 115 Final Project</title>
</head>
<body onload="headerFunction()">
<script src="projectJS.js"></script>
<header id="header">
<h1 id="h1"></h1>
<h2 id="h2"></h2>
<h3 id="h3"></h3>
</header>
<form action="" name="form1">
</body>
</html>
最佳答案
您应该使用浏览器的开发人员工具检查错误控制台,并查看是否收到以下错误:
Uncaught TypeError: hrule.setAttribute is not a function
这意味着 hurle
并不是您想象的那样。您将其视为一个元素,但实际上您正在返回一个元素数组。您可能需要第一个,因此您可以将其引用为 hrule[0]
。
从那里,您可以像之前尝试的那样使用 .style
设置宽度。
关于javascript - 仅使用 Javascript 设置 HR 标签的宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51334531/
我正在练习这个https://developer.mozilla.org/en/Canvas_tutorial/Basic_animations时钟教程。代码中的所有内容对我来说都很清楚。接受这个 h
这个问题在这里已经有了答案: What tags in HTML5 are acknowledged of being self-closing? (3 个答案) 关闭 9 年前。 简单的问题。一个
我有无法更改的 HTML 标记。 示例 TEXT 1 some text TEXT 2 some text 我想删除紧跟在另一个 hr 之后且它们之间没有文本的任何 hr。正
替代 CSS3 简单样式的标记,如果这不起作用,则在 hr 样式下面使用子语句或标准 标记的子语句,如下代码所示。 有淡出边缘的简单样式的 CSS3 标签见链接 http://css-tricks.c
我有一个带有各种链接的工具栏,用 分组元素。因为呈现哪些链接取决于用户的权限,所以我们可能会以两个连续的分隔符结束,或者在末尾有一个分隔符。这是我们不想要的。 Link 1 Absent link
-ability (in nouns 构成名词) : ◊ capability 能力 ◊ responsibility 责任 -ibility (in nouns 构成名词) : ◊ ca
我抓取了运行完成时间的数据集,其中包括在一小时内和一小时内完成的运行者。小时内的运行者编码为 M:S,例如48 分 12 秒完赛的选手为 48 分 12 秒。超过一小时的运行者编码为 H:M:S,例如
SAP HR 显然有几个模型来描述职位 (S)、工作 (C)、组织 (O) 和人员 (P) 对象之间的关系,组织管理 (OM) 模块用于维护这些对象。 P(Person)对象通常是持有者(S)。 有
我正在努力实现尽可能接近下图的东西。 我目前使用下面的代码获得以下内容,但似乎无法完全满足我的需要。 当前样式: 我的 CSS: hr:after { background: url('../
我想在 php 的表单内容中添加一条水平线。那可能吗? 我写了下面的代码,但“hr”在我的电子邮件中看起来像这样 PR1:产品1 PR2:product2 PR3:产品3 PR4:产品4 我该怎么办?
我目前正在使用 PHPWord 生成我的文档,但我想在文档中添加一条水平线。就像在 HMTL 中一样。在 Word 中,您可以通过在 Enter 中键入三个下划线来完成此操作,但我想在生成的文档中使用
在我的 fiddle 中,您会看到文本中断,我想添加 在那里并在 CSS 中装饰它,但我不知道如何执行此操作,因为当我这样做时它会破坏我的内联 block ,我想这是因为 是一个 block 元素。对
在我的 fiddle 中,您会看到文本中断,我想放一个 在那里并在 CSS 中对其进行装饰,但我不知道该怎么做,因为当我这样做时它会破坏我的内联 block ,我认为那是因为 是 block 元素。有
这段代码是我做的 {item.awards.map((obj,i) => Name :
我不确定该问题的确切标题是什么,因为我不知道是什么原因造成的,也不知道可能是什么,所以这个问题可能很难回答,但如果有人愿意花时间看看代码,我们将不胜感激。 这是问题:http://imgur.com/
我遇到了一些 的问题我网站上的标签。 reference image 正如您在这个非常简单的 fiddle 中看到的那样 https://jsfiddle.net/bau1hp9L/ 标签并非都以相
这个问题在这里已经有了答案: change the linear value of gradient hr (1 个回答) Using CSS alone, how can you have a B
我有一个 我需要它具有颜色(十六进制值)#ac8900。如果我用老式的方式设计它 它工作正常。但我希望用 CSS 设置所有样式,所以我在我的样式表中尝试了这个: hr{ color: #ac8900
我们有一条 hr 线,它下面有一个奇怪的黑色像素。 截图:http://i52.tinypic.com/2vwxy78.jpg 我们的代码: HTML: CSS: hr { border-b
有没有更简单的方法,无需任何技巧,让它在视觉上看起来像这样(底部边框从每边填充 10 像素),而不必为此创建额外的行? table { width: 100%; border-collapse
我是一名优秀的程序员,十分优秀!