用JS创建的元素：focus在IE之除外的浏览器无效

Question

元素是这么来的：

 var rootDiv = document.createElement("div");
 rootDiv.setAttribute("id", list[i].ID);
 rootDiv.setAttribute("class", "extent");

 var div = document.createElement("div");
 var input = document.createElement("input");
 input.setAttribute("type", "image");
 input.setAttribute("src", "/Content/Images/check.png");
 var p1 = document.createElement("p");
 var p2 = document.createElement("p");
 p1.setAttribute("class", "pinfo");
 p2.setAttribute("class", "pinfo");
 p1.innerHTML = "时间：" + new Date(list[i].SUBTIME).format("yyyy年MM月dd日");
p2.innerHTML = "备注：" + list[i].REMARK;
rootDiv.appendChild(input);
rootDiv.appendChild(div);
div.appendChild(p1);
div.appendChild(p2);
panel.appendChild(rootDiv);

css 是这样的：

 .extent:focus {
    border:2px solid #96C2F1;
    background-color: #EEFAFF
}

结果是在IE中，这是有效果的，但是在FF,CHROME等浏览者中没效果。还有就是如果我只是把那些元素直接写入HTML，也是有效果的

Answer 1

ie、chrome、firefox的添加元素和样式的语法不一样，你要想兼容，可以通过jquery进行添加试试。