如何利用js向指定位置添加一个div层

1、利用js代码首先创建一个div，document.createElement('div');

2、确认div添加位置，可以在某个dom元素后面，或者通过css属性控制具体位置，主要通过left/top等属性控制。

3、确定位置之后，显示div即可。

示例：比如html中有一个文本输入框，我们现在需要在挨着输入框右下角位置显示一个div。

方法：

function createDiv(){
    //首先创建div
    var descDiv = document.createElement('div');
    document.body.appendChild(descDiv);
    //获取输入框dom元素
    var text = document.getElementById('city');
    //计算div的确切位置
    var seatX = text.offsetLeft + text.offsetWidth;//横坐标
    var seatY = text.offsetTop + text.offsetHeight;//纵坐标
    //给div设置样式，比如大小、位置
    var cssStr = "z-index:5;width:420px;height:300px;background-color:#FFFF99;border:1px solid black;position:absolute;left:" 
    + seatX + 'px;top:' + seatY + 'px;';
    //将样式添加到div上，显示div
    descDiv.style.cssText = cssStr;
    descDiv.innerHTML = '这是一个测试的div显示的内容';
    descDiv.id = 'descDiv';
    descDiv.style.display = 'block';
}