使用Javascript添加侧栏并更改某些HTML页面上的填充

这可能很简单，但我完全不懂javascript，而且对HTML非常熟悉，所以我希望能帮上忙

我有一个非常简单的网站，我托管在一个家庭服务器上，在那里我写了我最喜欢的两个爱好的博客；书籍和旅行。我使用了一个CSS，我的站点上的所有页面都引用了它来进行布局，我有一个简单的javascript，它添加了一个页脚和一个顶部导航菜单。我喜欢这种方法，因为它使添加按钮到顶部导航窗格在未来变得超级简单，而不必触摸每个单独的页面。我想使用相同的方法在一些页面上添加一个侧边栏，我已经成功地做到了这一点。但是使用这种方法，我发现我需要调整（仅）我添加侧边栏的那些页面的正文的填充，以使侧边栏不只是融合到正文中的文本/图像中。我想补充一下

document.getElementById("nav03").style.padding = "5px 5px 5px 215px";

按照我的剧本，我可以做到，但我有点搞错了。填充似乎影响了我的侧边栏，而不是我调用“nav03”的页面主体。理想情况下，我希望在页面中添加“侧边栏”时进行填充更改，而不必有两个单独的调用，但我将其拆分为nav03只是为了进行测试，以消除添加侧边栏的代码可能会以某种方式干扰我的目标的可能性。下面是我的CSS、javascript和一个页面示例，如果有人能给我指出正确的方向，我想添加侧边栏。我相信这可能不是添加侧边栏的最佳方式，但它对我来说很舒服，而且似乎很容易在将来以与顶部导航菜单相同的方式进行更改

document.getElementById（“foot01”）.innerHTML=
“©；”+新日期（）.getFullYear（）+“codyfair.kicks-ass.net。保留所有权利。
”；
document.getElementById（“topnav”）.innerHTML=
“
”+
“
”+
“
”+
“
”+
“
”+
“
”；
document.getElementById（“侧栏”）.innerHTML=
“
”+
“
”+
“
”+
“
”+
“
”+
“
”；
document.getElementById（“nav03”）.style.padding=“5px 5px 5px 215px”
正文{
字体系列：“Lucida Sans Unicode”，Verdana，Sans serif；
字体大小：16px；
背景色：浅灰色；
颜色：#000000；
填充：3倍；
}
链接{颜色：绿色；背景色：透明；文本装饰：下划线}
a:已访问{颜色：浅灰色；背景色：透明；文本装饰：无}
a:悬停{颜色：红色；背景色：透明；文本装饰：下划线}
a:活动{颜色：黄色；背景色：透明；文本装饰：下划线}
#主要{
填充物：5px；
左侧填充：15px；
右侧填充：5px；
背景色：亚麻布；
边界半径：0 0 5px 5px；
}
h1{
字体系列：佐治亚，衬线；
边框底部：3倍实心灰色；
颜色：浅灰色；
字体大小：30px；
}
氢{
字体系列：佐治亚，衬线；
颜色：浅灰色；
字体大小：20px；
}
ul#topnav{
填充：0；
边缘底部：11px；
}
ul#topnav li{
显示：内联；
右边距：3倍；
}
ul#topnav li a{
背景色：亚麻布；
填充：10px 20px；
文字装饰：无；
颜色：#6969；
边界半径：4px4p0；
}
ul#topnav li a：悬停{
颜色：白色；
背景色：黑色；
} 
ul#侧栏{
位置：绝对位置；
顶部：60px；
左：0；
底部：0；
身高：100%
}
ul#侧边栏li{
右边距：3倍；
}
ul#侧边栏li a{
背景色：亚麻布；
文字装饰：无；
颜色：#6969；
边界半径：0px 0px 0；
}
ul#侧边栏li a：悬停{
颜色：白色；
背景色：黑色；
}

睡眠
目前阅读：


你在生活中遇到的一些书是如此感人，如此有关系，以至于它们几乎深深地触动了你
就像特殊的爱一样。在许多情况下，你变得如此依恋，以至于当其他人没有读过这些书时，你几乎会被冒犯，或者更糟的是，
我从没听说过他们。在这方面我很容易被冒犯，所以请查看我的前十名列表，然后去阅读它们！这张单子上的每一本书当然都是五颗星。
最近审查
单击每个标题阅读我的评论，并查看我的1-5星级评分

存档的评论

首先，你应该把导航装置放在
机身的内部

也就是说，填充不会影响身体，因为你的目标是nav03 ID

而是以“主”id为目标：

我相信这就是你想要的结果：


编辑

这可能会影响所有页面-这将不是您要查找的结果。您可能希望将侧导航脚本保存在另一个文件中，并且仅将其包含在将呈现侧导航的页面中。
如果我错了，请有人纠正我，但您确实不应该将标记（特别是导航）放在正文之外。也就是说，如果我没弄错的话，你真的只需要把衬垫调整到-或者我错了吗？我确实试过在身体内部移动导航呼叫，特别是衬垫呼叫，但这没有什么区别。我不想调整CSS中的填充，因为这样它将应用于所有页面，我只想在有侧边栏的页面上使用它。它可能不会，但您不想将这些元素保留在正文之外。我认为HTML5的工作方式会导致自动生成一个额外的嵌套body标记。与丹的回答类似，当我第一次看到你的回复时，我认为你在编辑中说的同样的话，这不会影响每一页吗？但当我尝试它时，它并没有，它似乎只影响添加了边栏导航标签的页面，所以它是完美的！至于车身标签内的导航呼叫，这会不会像是一种未来证明之类的东西？我隐约意识到HTML5即将问世
document.getElementById("main").style.padding = "5px 5px 5px 215px";