天天看点

如何在js添加table tr td标签 并找到所对应的id进行追加,并设置样式

{

                        var InCommentID = Array[i].InCommentID;

                        var WechatPic = Array[i].WechatPic;

                        var ClientName = Array[i].ClientName;

                        var Comment = Array[i].Comment;

                        var ComentDate = Array[i].ComentDate;

                        var Image = Array[i].Image;

                        var OrderTime = Array[i].OrderTime;

                        var Grade = Array[i].Grade;

                        if (InCommentIDisTrue != InCommentID) {

                            //创建table标签

                            oneRow = table.insertRow();  //插入一行  

                            cell1 = oneRow.insertCell(); //需要插入单元格

                            cell2 = oneRow.insertCell();

                            cell3 = oneRow.insertCell();

                            oneRow2 = table.insertRow(); //插入一行

                            cell11 = oneRow2.insertCell(); //需要插入单元格

                            cell12 = oneRow2.insertCell();

                            cell13 = oneRow2.insertCell();

                            if (Image != "") {

                                RowImages = table.insertRow(); //插入一行用于图片的加载

                                CellImages = RowImages.insertCell();

                            }

                            oneRow3 = table.insertRow(); //插入一行

                            cel1 = oneRow3.insertCell(); //需要插入单元格

                            cel2 = oneRow3.insertCell();

                            cel3 = oneRow3.insertCell();

                            //第一个行开始

                            //第一个单元格设置样式

                            cell1.style.width = "50%"

                            cell2.style.width = "30%"

                            cell1.style.color = "#FF0000";

                            //第一个单元格里添加div

                            var div = document.createElement("div");

                            //设置DIV的id

                            div.setAttribute("id", "ddd");

                            //将div添加到第一个单元格

                            cell1.appendChild(div);

                            //设置div的内容

                            div.innerHTML = '<img src="' + WechatPic + '" style="width: 30px; height: 30px;" />';

                            var divv = document.createElement("div");

                            divv.setAttribute("id", "dd");

                            cell1.appendChild(divv);

                            divv.innerHTML = '' + ClientName + '';

                            cell2.innerHTML = "";

                            cell3.innerHTML = '' + ComentDate + '';

                            //第一个行结束

                            //第二个行开始

                            //第一个单元格里添加div

                            var divPL = document.createElement("div");

                            //设置DIV的id

                            divPL.setAttribute("id", "PL");

                            //将div添加到第一个单元格

                            cell11.appendChild(divPL);

                            //设置td跨行的属性

                            cell11.setAttribute("colspan", "3");

                            divPL.innerHTML = '' + Comment + '';

                            cell12.innerHTML = "";

                            cell13.innerHTML = "";

                            //第二个行结束

                            //第三个行开始

                            //colspan = "3";

                            //cell.setAttribute("id", "td2");

                            //第一个单元格里添加div

                            var divPLL = document.createElement("div");

                            //设置DIV的id

                            divPLL.setAttribute("id", "PLL");

                            //将div添加到第一个单元格

                            cel1.appendChild(divPLL);

                            divPLL.innerHTML = "购买日期:" + OrderTime + "";

                            cel2.innerHTML = "";

                            cel3.innerHTML = "";

                            //第三个行结束

                            if (Image != "") {

                                //显示图片的td的id

                                if (InCommentID != InCommentIDisTrue) {

                                    CellImages.id = "Image" + InCommentID + "";

                                    //第一个单元格里添加div

                                    var divImage = document.createElement("div");

                                    //设置DIV的id

                                    divImage.setAttribute("id", "divImage");

                                    //设置div的类名

                                    divImage.setAttribute("class", "ClassImage")

                                    //将div添加到第一个单元格

                                    CellImages.appendChild(divImage);

                                    //设置div的内容

                                    divImage.innerHTML = '<img src="' + WechatPic + '" style="width: 30px; height: 30px;" />';

                                }

                            }

                        }

                        else {

                            if (InCommentID == InCommentIDisTrue) {

                                //创建div

                                var divImages = document.createElement("div");

                                //设置div的类名

                                divImages.setAttribute("class", "ClassImage")

                                //找到tr的id

                                var divA = document.getElementById("Image" + InCommentID + "");

                                //追加到相同主键的图片显示区域

                                divA.appendChild(divImages)

                                //显示内容

                                divImages.innerHTML = '<img src="' + WechatPic + '" style="width: 30px; height: 30px;" />';

                            }

                        }

                        //用于比较主键是否一样

                        InCommentIDisTrue = InCommentID

                    }