gpt4 book ai didi

javascript - 使用纯 JS 创建具有 id 和样式的元素

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

我构建了一个小函数,附加一个带有 id 和样式的元素。并知道我的问题为什么这段代码不起作用?

    window.addEventListener("load",function(e){
var inButton = document.createElement("DIV"),
body = document.body;
inButton.id = "button";
inButton.style = function (){
height = "200px";
width = "400px";
position = "fixed";
top = "50%";
left = "50%";
marginLeft = -1*(this.width / 2);
marginTop = -1*(this.height / 2);
};
body.appendChild(inButton);
}, false);

我使用以下 html:


<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<meta name="description"/>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta http-equiv="x-ua-compatible" content="ie=edge" />
<script type="text/javascript" src="js/vendor/modernizr-.8.3.min.js"></script>
</head>
<body>
<script type="text/javascript" src="js/plugins.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</body>
</html>

Js 代码位于 main.js 内。

我反复检查了路径,但路径完全正确。

最佳答案

您没有正确设置 style 属性。其余代码是正确的。

这是一个示例

window.addEventListener("load", function(e) {
var inButton = document.createElement("DIV"),
body = document.body;
inButton.id = "button";
inButton.innerHTML = "Yahooooooooooooooo"; //For example

inButton.style.height = "200px";
inButton.style.width = "400px";
inButton.style.position = "fixed";
inButton.style.top = "50%";
inButton.style.left = "50%";
inButton.style.marginLeft = -1 * (this.width / 2);
inButton.style.marginTop = -1 * (this.height / 2);

body.appendChild(inButton);
}, false);

关于javascript - 使用纯 JS 创建具有 id 和样式的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28726675/

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