3

我是 javascript 的初学者。我正在尝试在 php 生成的页面上添加一个函数来使用 javascript 生成新的表单元素。

该代码适用于创建新的<tr>, <td>, <input type="text">html 元素。但是，当我尝试使用 css 样式创建按钮时，我发现样式从标签中丢失了。

if(document.createElement) 
var tr = document.createElement("tr");
var input = document.createElement("input");
// If NS is passed, should become NS[2] etc
input.id = field+"["+count+"]";
input.name = field+"["+count+"]";
input.type = "text"; //Type of field - can be any valid input type like text,file,checkbox etc.

var td=document.createElement("td");
var newContent = document.createTextNode("NS");
td.appendChild(newContent);

tr.appendChild(td);     
td=document.createElement("td");        
td.appendChild(input);
tr.appendChild(td);                 

var btnDel=document.createElement("a");
btnDel.class="btn btn-primary";
btnDel.onclick = "addField(\'nameservers\',\'NS\',10);" ;


var btnText=document.createElement("span");
btnText.class="btn-label";
btnText.innerHTML="Add";


btnDel.appendChild(btnText);        
td.appendChild(btnDel);
tr.appendChild(td);         
field_area.appendChild(tr);

}

生成的代码显示：

<a><span>Add</span>
</a>
</td>

而不是我所期望的：

<a onclick="addField('nameservers','NS',10);" class="btn btn-primary">
<span class="btn-label">Add     
</span>
</a>

我究竟做错了什么？使用脚本传递所有 html 属性的正确方法是什么？

4

2 回答 2

2

对于点击

与其尝试将其输出到 HTML 中，不如使用该addEventListener方法在纯 Javascript 中执行此操作？

element.addEventListener('click', function() {

    addField('nameservers','NS',10);

    }, false);

这种方法被称为非侵入式 Javascript，它实际上是开发网站时非常理想的属性。

对于班级

如前所述，使用className和不使用class.

class通常在 as new class 的声明之前，并且不能像属性一样使用，就像你不能调用变量一样var。

于 2013-07-22T11:58:08.510 回答
2

使用className=而不是class=. 所以它会像：

btnDel.className="btn btn-primary";

这是因为这个class词是 JavaScript 中的保留词。

于 2013-07-22T11:55:22.903 回答