javascript - Handle rowspan and colspan while converting "Table" into "Div" -
I am converting the table into structured data using the code below.
$ ('# html' ($ ('# content') .html () .replace (/ & lt; tbody / gi, "& lt; div id = 'table'") .replace (/ & lt; tr / gi; Div style = 'overflow: auto; padding-top: 15px;' ') .replace (/ & lt; / tr & gt; / gi, "& lt ; / Div & gt; ") .replace (/ & lt; td / gi, & lt; span style = 'float: left; margin-right: 20px;'") .replace (/ & lt; \ / td & Gt; gi, "& lt; / span & gt;") .replace (/ & lt; / tbody / g, "
It works well in all scenarios except ROWSPAN; COLSPAN case.
How can I manage the issue of that design when I convert a div into a table? I am stuck in it.
Perhaps it takes you in the right direction:
.replace (/ rowspan = "/ gi, 'class =" rowspan-'). Then make the style for the classes (such as Roshan-2 or Callspain-3 etc.). However, these are those cases. Does not solve where there are two lines of an element- and colspan, but this is a beginning. There will be a better way:
var copyAttr = function (old, $ new) {for (var i = 0, attributes = old; attributes; i & lt ; Attributes.length; i ++) {$ new.attr (attributes [i] .name, attributes [i] .value); } Return $ new; } $ ('# Content'). ('TBI'). Each (function () {var $ new = copyAttr ($, '$ id (' & lt; div id = "table" & gt; & lt; / div & gt; '; $ (This) ('' Tr '') ('' Tr '') Each (function () {var $ new = copyAttr (this, $ ('& lt; div class = "tr" Var $ new = copyAttr (this, $ ('& lt; span class = "td" & gt; & lt; / span & gt;'); $ (this) .replacewith ($ new);})
Changed entire table structure with divs and spans with all properties of table elements. Next you can change the line-and colspan attributes to classes.
< Code> $ ('# table .td') .each (function () {var $ t = $ (this); $ t .addClass ('rowspan - '$ T.attr (' rowspan ')) .removeAttr (' rowspan ') .addClass (' colspan- '+ $ T.attr (' colspan ')) .removeAttr (' colspan ');});
Comments
Post a Comment