Question

我正在尝试此代码，但它不起作用。请帮助。在这里我只是想创建一个div块并改变它的属性？

<html>
<head>
<script >
function create()
{
l=document.createElement('div');
l.id='10';
l.style.position='absolute';
l.style.top='100px';
l.style.left='200px';
l.style.height='100px';
l.style.width='100px';
l.style.backgroundColor='yellow';
l.style.zIndex='100';
}
</script>
</head>
<body>
<input type="submit" name="cssandcreate" id="cssandcreate" value="css"  onclick="create()"/>
</body>
</html>

Answer 1

你不能只创建元素并等到它出现，你也应该将它添加到DOM中。

示例：

document.body.appendChild(l);

Answer 2

尝试这样的事情

 function createDiv() {
        var divTag = document.createElement("div");
        divTag.id = "div1";
        divTag.className = "divdrag";

        par = document.getElementById('stage'); 

        par.insertBefore(divTag, par.firstChild);
    }

    createDiv();

<强> CSS

.divdrag{
          width:688px;
          position:relative;
          margin-top:20px;
          display:inline-block;
          height:50px;
            border: 1px solid red;

         }
        .divdrag:hover{
        -webkit-box-shadow: 1px 1px 3px #999;
        box-shadow: 1px 1px 3px #999;
        border:0.7px dotted;
            }

看看小提琴http://jsfiddle.net/3ZPEy/1/

Answer 3

HTML

<input type="button" name="cssandcreate" id="cssandcreate" value="css"  onclick="create()"/>

JS

function create() {
    var l = document.createElement('div');
    l.id = '10';
    l.style.position = 'absolute';
    l.style.top = '100px';
    l.style.left = '200px';
    l.style.height = '100px';
    l.style.width = '100px';
    l.style.backgroundColor = 'yellow';
    l.style.zIndex = '100';
    document.body.appendChild(l);
}

通过javascript创建一个div框

3 个答案: