在Jquery中使用Parsed JSON创建html表，添加​​图像和输入字段

Question

我在互联网上看到很多关于循环JSON对象并将其打印在html表中的示例。然而我的问题有点不同，因为我需要第一列成为图像，接下来的几列是来自json数组的json数据，最后是最后一列中的输入字段（来自此输入字段的值来自json阵列也是如此）。

以下是我所拥有的完整JSON，其中tabledata包含创建html表所需的信息数组：

{"approverName":"","emailAddress":"","companyName":"ABC","address":{"streetAddress1":"12 BlahBlah","streetAddress2":"","state":"ON","zipCode":"","country":"SO","phoneNumber":""},"tabledata":[{"vendorPart":"AAAAA","partDescription":"N/A","price":"0.00","quantity":"28"},{"vendorPart":"BBBBBBB","partDescription":"N/A","price":"0.00","quantity":"3"},{"vendorPart":"CCCCCC","partDescription":"N/A","price":"0.00","quantity":"25"}]}

这是我的Jquery的ajax成功函数，它击中了web服务并得到了数据（只是让你知道如何使用/创建JSON对象）：

success: function(data, status, jqxhr) {
                    var xml = $($.parseXML(data)), // Parse the XML String to a Document, and Wrap jQuery
                    json = xml.find("string").text(), // Get the text of the XML
                    jsonObj = $.parseJSON(json); // Parse the JSON String
                    $('#approver').val(jsonObj.approverName);
                    $('#emailaddress').val(jsonObj.emailAddress);
                    $('#address1').val(jsonObj.address.streetAddress1);
                    $('#address2').val(jsonObj.address.streetAddress2);
                    $('#postalcode').val(jsonObj.address.zipCode);
                    $('#city').val(jsonObj.address.state);
                    $('#country').val(jsonObj.address.country);
                    $('#phone').val(jsonObj.address.phoneNumber);

                 },

分配输入字段后，我需要将表单设置为look like this (hard-coded at the moment)

基于此图像，您可以看到第一列是图像，第二列是jsonObj的数据，第四列是我必须创建的输入字段，其值也来自jsonObj。

以下是输入的代码：

<input class="quantityClass" type="number" name="quantity" min="0" />

我也想知道，如果用jquery渲染表，我在这个表上做了很多CSS，CSS是否仍然在正确的时间生效？我希望js / css同时运行。