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

曾经终败给现在 2021-09-29 16:02 525阅读 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 条评论，525人围观）

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

相关阅读

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

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

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

相关什么是 HTML div标签以及如何使用 CSS 设置样式

HTML 分割标记，简称为“div”，是一种特殊元素，可让您在网页上将相似的内容集组合在一起。您可以将其用作关联相似内容的通用容器。标签是最常用的`div`标签之一，尽管引

柔情只为你懂/ 2023年09月28日 08:19/ 0 赞/ 18 阅读

相关 FeignClient 设置 fallback不起作用

FeignClient 设置 fallback不起作用出现设置fallback不起作用大家可以检查下自己的xx.yml配置文件中的以下配置是否设置为true，若为

偏执的太偏执、/ 2023年06月25日 03:10/ 0 赞/ 55 阅读

相关 vue中修改Element ui样式不起作用

当你看到这个文章的时候，我就知道你必然跟我遇到了同一个问题。第一步： scoped作用：我们经常会在css当中会写，表示它的样式作用于当下的模块，所以将scoped去

缺乏、安全感/ 2023年02月26日 05:21/ 0 赞/ 37 阅读

相关 FeignClient 设置 fallback不起作用

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

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

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

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

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

相关 Excel 样式设置

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

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

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

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

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

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

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

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

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

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

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