1

我正在尝试使用 javascript 在 div 中动态创建一个复选框。这是我的代码的一部分

var input = document.createElement('input');
input.setAttribute('id', 'chkFilm_1');
input.setAttribute('type', 'checkbox');
input.setAttribute('name', 'four');
input.setAttribute('style', 'margin-left:2px;');

var divFilm = document.createElement('div');
divFilm.className = "ChekMarkWrap";   
divFilm.appendChild(input);
divFilm.appendChild(document.createElement('br'));
divFilm.innerText = "film";

我想要实现的是在 div 的 innerText 之前插入复选框。但是文本总是在 div 的 innerText 之后。

4

4 回答 4

2

看起来你的问题可能是这条线：

divFilm.innerText = "film";

这将替换 divFilm 文本而不是附加到它。

以下代码似乎有效

var input = document.createElement('input');
input.setAttribute('id', 'chkFilm_1');
input.setAttribute('type', 'checkbox');
input.setAttribute('name', 'four');
input.setAttribute('style', 'margin-left:2px;');

var divFilm = document.getElementById("film")

divFilm.appendChild(input)
divFilm.appendChild(document.createElement('br'));
divFilm.innerHTML += 'film';

这会将这些元素添加到 html 中 id 为“film”的 div 中。

这在以下链接中工作http://jsfiddle.net/yeQeC/

于 2013-08-12T07:14:34.540 回答
0

这个怎么样：

divFilm.innerHTML =  divFilm.innerHTML + input.outerHTML+"film" ;

甚至更短：

divFilm.innerHTML +=  input.outerHTML+"film" ;
于 2013-08-12T07:14:53.223 回答
0

在附加 div 后尝试附加复选框，试试这个：

divFilm.parentNode.insertBefore(input, divFilm);
于 2013-08-12T07:17:49.757 回答
0 
divFilm.insertBefore(input, divFilm.childNodes[0]);

http://jsfiddle.net/QgAt3/

于 2013-08-12T07:20:04.397 回答