如何动态为div标签创建一个font标签？

z463135048 2014-11-19 11:04:44
请问我用js动态创建了一个div标签，那么怎么为这个标签加font 标签呢？动态创建的div标签代码如下：
function createElement(id,align,position,left,top,width,height,background,overflow) {

				var divMain = document.getElementById("divMain");

				if(document.getElementById(id)==null){

					var createDiv=document.createElement("div");  

					createDiv.id= id; 

					createDiv.align= align; 

					createDiv.position=position;

					createDiv.style.left=left;

					createDiv.style.top=top;

					createDiv.style.width=width;  

					createDiv.style.height=height; 

					createDiv.style.background=background;  

					createDiv.style.overflow=overflow; 

					divMain.appendChild(createDiv);

				}	  

			}

现在想在这个div标签中加一个front标签，大致效果如下图：
...全文
374 8 打赏 收藏 转发到动态 举报
写回复
用AI写文章
8 条回复
切换为时间正序
请发表友善的回复…
发表回复
graychens 2014-11-23
  • 打赏
  • 举报
 回复
你的位置要写成 createDiv.style.position="relative"; 再加上createDiv.style.zIndex = "9999" 应该就能顶层显示了。另外background 设成透明的，，只留内容就好，不然有点难看
z463135048 2014-11-20
  • 打赏
  • 举报
 回复
我后来用了marginLeft和marginTop 就是能调位置了，我觉得是因为我这个div是新建的，可能是需要给他指明是相对于父类的位置
Go 旅城通票 2014-11-20
  • 打赏
  • 举报
 回复
设置left/width对absolute/fixed定位的元素是有效果的，除非你定位不是这2个值
z463135048 2014-11-20
  • 打赏
  • 举报
 回复
引用 4 楼 showbo 的回复:
[quote=引用 2 楼 z463135048 的回复:] [quote=引用 1 楼 slwsss 的回复:] 
function createElement(id,align,position,left,top,width,height,background,overflow) {
                var divMain = document.getElementById("divMain");
                if(document.getElementById(id)==null){
                    var createDiv=document.createElement("div");  
                    createDiv.id= id; 
                    createDiv.align= align; 
                    createDiv.position=position;
                    createDiv.style.left=left;
                    createDiv.style.top=top;
                    createDiv.style.width=width;  
                    createDiv.style.height=height; 
                    createDiv.style.background=background;  
                    createDiv.style.overflow=overflow; 
                    divMain.appendChild(createDiv);
                  var font=document.createElement("font");
                  font.innerText="aaaaaaaaaaa";
                  createDiv.appendChild(font);
                }      
            }
哥们你好，你这方法是可行的。我现在还有两个问题：1 我动态创建的这个div标签不是在最顶层的，即原来HTML中这个位置有图片，这张图片盖住了我创建的标签的一部分，有什么办法让这个div置顶呢？ 2 这个div里面我用的style.left，style.top 怎么没效果，这个标签一直位于HTML左上角位置。怎么调他位置。请问你知道吗？非常谢谢你的解答啊！ [/quote]加了xhtml什么要加px单位，要不设置left，top，width，height无效 
    function createElement(id, align, position, left, top, width, height, background, overflow) {
        var divMain = document.getElementById("divMain");
        if (document.getElementById(id) == null) {
            var createDiv = document.createElement("div");
            createDiv.id = id;
            createDiv.align = align;
            createDiv.position = position;
            createDiv.style.left = left+'px';
            createDiv.style.top = top + 'px';
            createDiv.style.width = width + 'px';
            createDiv.style.height = height + 'px';
            createDiv.style.zIndex = 9999999;
            createDiv.style.background = background;
            createDiv.style.overflow = overflow;
            divMain.appendChild(createDiv);
            createDiv.innerHTML = '<font color="red">xxxxxx</font>';
        }
    }
[/quote]还是没效果。我之前能设置大小，就是位置不能调,，都是有加px的。我写成 createDiv.style.left = '200'+'px'; createDiv.style.top = '200' + 'px' 也一样
slwsss 2014-11-19
  • 打赏
  • 举报
 回复
引用 2 楼 z463135048 的回复:
用margin-left、z-index
z463135048 2014-11-19
  • 打赏
  • 举报
 回复
引用 1 楼 slwsss 的回复:
function createElement(id,align,position,left,top,width,height,background,overflow) {
                var divMain = document.getElementById("divMain");
                if(document.getElementById(id)==null){
                    var createDiv=document.createElement("div");  
                    createDiv.id= id; 
                    createDiv.align= align; 
                    createDiv.position=position;
                    createDiv.style.left=left;
                    createDiv.style.top=top;
                    createDiv.style.width=width;  
                    createDiv.style.height=height; 
                    createDiv.style.background=background;  
                    createDiv.style.overflow=overflow; 
                    divMain.appendChild(createDiv);
                  var font=document.createElement("font");
                  font.innerText="aaaaaaaaaaa";
                  createDiv.appendChild(font);
                }      
            }
哥们你好，你这方法是可行的。我现在还有两个问题：1 我动态创建的这个div标签不是在最顶层的，即原来HTML中这个位置有图片，这张图片盖住了我创建的标签的一部分，有什么办法让这个div置顶呢？ 2 这个div里面我用的style.left，style.top 怎么没效果，这个标签一直位于HTML左上角位置。怎么调他位置。请问你知道吗？非常谢谢你的解答啊！
slwsss 2014-11-19
  • 打赏
  • 举报
 回复 
function createElement(id,align,position,left,top,width,height,background,overflow) {
                var divMain = document.getElementById("divMain");
                if(document.getElementById(id)==null){
                    var createDiv=document.createElement("div");  
                    createDiv.id= id; 
                    createDiv.align= align; 
                    createDiv.position=position;
                    createDiv.style.left=left;
                    createDiv.style.top=top;
                    createDiv.style.width=width;  
                    createDiv.style.height=height; 
                    createDiv.style.background=background;  
                    createDiv.style.overflow=overflow; 
                    divMain.appendChild(createDiv);
                  var font=document.createElement("font");
                  font.innerText="aaaaaaaaaaa";
                  createDiv.appendChild(font);
                }      
            }
Go 旅城通票 2014-11-19
  • 打赏
  • 举报
 回复
引用 2 楼 z463135048 的回复:
[quote=引用 1 楼 slwsss 的回复:] 
function createElement(id,align,position,left,top,width,height,background,overflow) {
                var divMain = document.getElementById("divMain");
                if(document.getElementById(id)==null){
                    var createDiv=document.createElement("div");  
                    createDiv.id= id; 
                    createDiv.align= align; 
                    createDiv.position=position;
                    createDiv.style.left=left;
                    createDiv.style.top=top;
                    createDiv.style.width=width;  
                    createDiv.style.height=height; 
                    createDiv.style.background=background;  
                    createDiv.style.overflow=overflow; 
                    divMain.appendChild(createDiv);
                  var font=document.createElement("font");
                  font.innerText="aaaaaaaaaaa";
                  createDiv.appendChild(font);
                }      
            }
哥们你好，你这方法是可行的。我现在还有两个问题：1 我动态创建的这个div标签不是在最顶层的，即原来HTML中这个位置有图片，这张图片盖住了我创建的标签的一部分，有什么办法让这个div置顶呢？ 2 这个div里面我用的style.left，style.top 怎么没效果，这个标签一直位于HTML左上角位置。怎么调他位置。请问你知道吗？非常谢谢你的解答啊！ [/quote]加了xhtml什么要加px单位，要不设置left，top，width，height无效 
    function createElement(id, align, position, left, top, width, height, background, overflow) {
        var divMain = document.getElementById("divMain");
        if (document.getElementById(id) == null) {
            var createDiv = document.createElement("div");
            createDiv.id = id;
            createDiv.align = align;
            createDiv.position = position;
            createDiv.style.left = left+'px';
            createDiv.style.top = top + 'px';
            createDiv.style.width = width + 'px';
            createDiv.style.height = height + 'px';
            createDiv.style.zIndex = 9999999;
            createDiv.style.background = background;
            createDiv.style.overflow = overflow;
            divMain.appendChild(createDiv);
            createDiv.innerHTML = '<font color="red">xxxxxx</font>';
        }
    }
HTML必知必会精讲
本课程《HTML必知必会精讲》详细讲述了HTML必备知识点，内容包括：HTML概述、HTML规范、HTML思想、HBuilder工具的介绍和使用、常见标签（字体font标签、加粗b标签、下划线u标签、删除线s标签、字体倾斜i标签、上标sup标签和下标sub标签、注释标签、标题h1标签、水平线hr标签、特殊字符、列表标签）、图片img标签、HTML中的路径问题讨论（绝对路径和相对路径）、pre标签和p标签、超链接a标签、表格table标签、表单form标签（文本输入框text，密码输入框password，单选输入框radio，复选输入框checkbox，文本域textarea，文件上传项file，提交按钮submit，恢复按钮reset，普通按钮button，下拉输入框select，隐藏项hidden）、div和span标签、元标签meta、base标签、link标签、页面框架标签frameset。课程特色：所有内容均详细演示使用步骤和细节，全程手写代码，零基础都可轻松掌握！
ThreeJS动态加载div标签
html中标签样式： .tap{ position: absolute; background-color: MidnightBlue; background-color:rgba(0,10,40); border-top-left-radius: 10px; border-...
原生JS在DIV下添加label标签，label里面再添加input
原生JS动态在创建一个label然后在里面再添加一个font，最后在添加到指定id的div里面
解决contenteditable内自动生成font标签问题
问题描述： div设置了contenteditable之后，如果里面存在代码块，且有背景颜色，那么在刚删除此带背景颜色区域的时候，立刻输入文本，新输入的文本也会默认带着颜色（想要的效果是新输入的文本不带任何样式），通过F12查看发现生成了font标签，且继承了刚才删除的代码块的背景色。 将上面“这是主诉的值“删除，删除后紧接着输入新文本“这是新输入的值，应该是纯文本的“ 通过上面发现，删除带有...
Jquery 创建标签属性
前端-jq创建标签/添加属性/css属性 阅读目录 jq创建标签 jq添加属性如href，id，class，name等 jq添加style属性即css，如width，height，text_aling jq向标签里添加标签 在父标签里添加子标签 jq获取checkbox的值 前端接收后端json数据，循环遍历添加标签 jq创建标签 var ptag = $('<p>'); 回到顶部 jq添加属性如href，id，class，name等 $('#conten
JavaScript

87,910

社区成员

224,616

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章