gpt4 book ai didi

javascript - JS - 无法读取 null 的属性 'setAttribute'

转载 作者:太空狗 更新时间:2023-10-29 14:04:40 25 4
gpt4 key购买 nike

<分区>

我是 javascript 的新手,想编写 html 网站的 header 。JS: when window width is smaller than 1215px --> left part goes 100% width;标题的右侧部分为 0

我总是收到“无法读取 null 的属性‘setAttribute’”错误!

请帮忙!代码:

if (window.innerWidth < 1215) {
document.getElementById("#headerLeft").setAttribute("style", "width:100%");
document.getElementById("#headerRight").setAttribute("style", "width:0%");
} else {
document.getElementById("#headerLeft").setAttribute("style", "width:50%");
document.getElementById("#headerRight").setAttribute("style", "width:50%");
}
body {
margin:0;
}

header{
height:100px;
width:100%;
}

#headerLeft {
background-color:#FF7043;
height:100px;
float:left;
}

#headerRight {
background-color:#FFFFFF;
height:100px;
float:right;
}

.headerTitle {
font-family:'Roboto', sans-serif;
margin:15px;
font-size:70px;
}

#headerRight .headerTitle {
text-align:left;
color:#FF7043;
font-weight:300;
}

#headerLeft .headerTitle {
text-align:center;
color:#FFFFFF;
font-weight:900;
}
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>example</title>

<!-- css -->
<link type="text/css" rel="stylesheet" href="style.css">

<!-- fonts -->
<link href='https://fonts.googleapis.com/css?family=Roboto:400,500,700,900,100,300' rel='stylesheet' type='text/css'>

<!-- javascripts -->
<script language="javascript" type="text/javascript" src="script.js"></script>

</head>
<body>
<header>
<div id="headerLeft">
<p class="headerTitle">example</p>
</div>

<div id="headerRight">
<p class="headerTitle">example</p>
</div>
</header>

<nav>
</nav>

<main>
</main>

<footer>
</footer>
</body>
</html>

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