JavaScript 创建DIV 设置样式不起作用，很多都是因为设置样式的顺序问题

曾经终败给现在 2021-09-29 16:02 483阅读 0赞

JavaScript 创建DIV 设置样式不起作用，很多都是因为设置样式的顺序问题，因为有的样式需要之前设置其他样式才能生效，推荐的样式排序如下：

insertDIV:function(){
    
    　　var divId=document.getElementById("divContainer");
    
    　　if(divId){
    
    　　　　divId.style.display="block";   //作用：一般这种需要设置退出时候就消失了，可以设置display为none隐藏，那么再添加时候不需要重新create，可以找到设置display为block就                                                                  行，这样就避免了，重复生成DIV
    
    　　}
    
    　　else{
    
    　　　　var mainDiv=document.getElementById("main_div");   //创建新DIV时候先找到父DIV
    
    　　　　childDiv=document.createElement("div");   //创建DIV
    
    　　　　childDiv.id="divContainer" ;  //这个必须跟第一句代码中的id保持一致
    
    　　　　childDiv.style.width="150px";
    
    　　　　childDiv.style.height="250px";
    
    　　　　childDiv.style.position="absolute";  //这个必须设置为absolute才能浮在上面显示，并且只能先设置宽高，再设置position
    
    　　　　childDiv.style.bottom="10px";    //再设置显示位置，底部多少
    
    　　　　childDiv.style.right="15px";   //设置显示位置，右侧多少
    
    　　　　mainDiv.appendChild(childDiv);   //添加到父容器中
    
    　　}
    
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，483人围观）

还没有评论，来说两句吧...

相关阅读

相关创建、运行、设置Android 样式

目录一、创建安卓应用二、运行安卓应用三、设置屏幕标签 1、切换视图 2、设置标签字号和颜色 3、修改应用程序标题四、修改主布局并设置布局属性 1

淩亂°似流年/ 2024年04月06日 12:44/ 0 赞/ 21 阅读

相关 FeignClient 设置 fallback不起作用

StringCloud FeignClient 设置 fallback不起作用今天在配置feign中是用hystrix的时候，FeignClient 中的 fallba

清疚/ 2022年06月09日 13:59/ 0 赞/ 756 阅读

相关 TR设置背景颜色不起作用

今天修改界面的时候发现有一个table里面设置tr的背景颜色没有反应，发现也没什么问题但是就是不行。打开浏览器F12发现添加的背景颜色属性已经设置进去了，但是就是没效果。最

逃离我推掉我的手/ 2022年05月24日 02:49/ 0 赞/ 672 阅读

相关为什么设置了placeholder不起作用？

<textarea placeholder="请写下您的评价，对他人的帮助很大哦"></textarea> //</textarea>要紧跟哦">的后面中间

曾经终败给现在/ 2022年05月13日 20:47/ 0 赞/ 196 阅读

相关 eclipse调试时设置断点不起作用问题

![70][] [70]: /images/20220511/e5d77792ac274de08635d6c7ed194b6c.png

小鱼儿/ 2022年05月11日 02:04/ 0 赞/ 208 阅读

相关 Excel 样式设置

常用操作 [POI中设置Excel单元格格式（背景色，居中，字体，边框，列宽，行高，自动换行等）][POI_Excel] 设置列宽自动必须在单元格设值以后，再进

缺乏、安全感/ 2022年05月09日 00:26/ 0 赞/ 173 阅读

相关 vue-router的link样式设置问题

发现router-link添加上去后文字上会出现下划线，打开调试工具发现router-link其实是由a来实现的，在reset的时候 a { text

缺乏、安全感/ 2022年05月08日 08:48/ 0 赞/ 195 阅读

相关解决vue组件中给body设置样式不起作用的简单办法

给template中的第一个div设置如下样式 .body-bg { position: absolute; width: 100%;

太过爱你忘了你带给我的痛/ 2022年04月01日 07:40/ 1 赞/ 1480 阅读

相关 react-tips3: 设置样式设置组件的样式

react 页面样式的设置，和普通的页面样式设置没有太大区别；首先我们创建一个Index组件，目录如下：

怼烎@/ 2022年03月18日 03:40/ 0 赞/ 289 阅读

相关 JavaScript 创建DIV 设置样式不起作用，很多都是因为设置样式的顺序问题

JavaScript 创建DIV 设置样式不起作用，很多都是因为设置样式的顺序问题，因为有的样式需要之前设置其他样式才能生效，推荐的样式排序如下： insertDIV

曾经终败给现在/ 2021年09月29日 16:02/ 0 赞/ 484 阅读