将后台返回字符串数据转为jquery对象,并做一些操作
2016-12-14 10:14
274 查看
在 web 开发中,经常会有后台返回 html 字符串的情况,需要在 js 里将其 转为 juery 对象或者 DOM 并做一些处理,下面这是我在实际中遇到的一点问题,记录一下。
问题如下:
后台获取的字符串是一大段 html , 然后 转为 juery 对象,从中 取出一部分,本来取出来的也是 juery 对象,大致如下 (转为jquery对象,有的浏览器 会格式化 加换行 \r\n)
var str = "<TD>合计</TD>" +
"<TD></TD>" +
"<TD></TD>" +
"<TD>5</TD>" +
"<TD>8</TD>" +
"<TD>4</TD>" +
"<TD>0</TD>" +
"<TD>0</TD>" +
"<TD>17</TD>" +
"<TD>8</TD>" +
"<TD>13</TD>" +
"<TD>9</TD>" +
"<TD>5</TD>" +
"<TD>9</TD>" +
"<TD>0</TD>" +
"<TD>44</TD>" +
"<TD>5</TD>";
前台 需要 合并单元格 ,因此要把前三个 <td> 去掉, 原本是想直接 截取字符串,谁知道 不同浏览器 ,在转为 juery 对象时,有的会自己格式化加上换行 \r\n ,有的不会,因此不同浏览器 字符串长度也不同,截取的不一样,后来就通过判断浏览器来解决。
后来我想了想,这样兼容性很不好,后来我想了想,可以直接通过 操作 jquery 对象删除 td 的,看了看 jquery 手册 ,找到如下方法:
1、var dd = $("<tr>"+str+"</tr>"); //重点就在这里
2、 var divHtml = dd.find('td:eq(0),td:eq(1),td:eq(2)').remove(); //找到前三个 td 去掉
alert(dd.html());
第一步,外层一定要加上 <tr>,不然转为 jquery 对象是 只会转第一个 <td>,后面的都没有了,而且我试了,外面 加<div> 也不行,外面 加<table>可以,不过它会自动在table下面加上 一层 tbody ,再加一层 tr
后来总结下,可以转为 jquery 对象时,外层必须加上一层,而且要符合 html 代码的规则,就好比 td 外面要 加 tr
问题如下:
后台获取的字符串是一大段 html , 然后 转为 juery 对象,从中 取出一部分,本来取出来的也是 juery 对象,大致如下 (转为jquery对象,有的浏览器 会格式化 加换行 \r\n)
var str = "<TD>合计</TD>" +
"<TD></TD>" +
"<TD></TD>" +
"<TD>5</TD>" +
"<TD>8</TD>" +
"<TD>4</TD>" +
"<TD>0</TD>" +
"<TD>0</TD>" +
"<TD>17</TD>" +
"<TD>8</TD>" +
"<TD>13</TD>" +
"<TD>9</TD>" +
"<TD>5</TD>" +
"<TD>9</TD>" +
"<TD>0</TD>" +
"<TD>44</TD>" +
"<TD>5</TD>";
前台 需要 合并单元格 ,因此要把前三个 <td> 去掉, 原本是想直接 截取字符串,谁知道 不同浏览器 ,在转为 juery 对象时,有的会自己格式化加上换行 \r\n ,有的不会,因此不同浏览器 字符串长度也不同,截取的不一样,后来就通过判断浏览器来解决。
后来我想了想,这样兼容性很不好,后来我想了想,可以直接通过 操作 jquery 对象删除 td 的,看了看 jquery 手册 ,找到如下方法:
1、var dd = $("<tr>"+str+"</tr>"); //重点就在这里
2、 var divHtml = dd.find('td:eq(0),td:eq(1),td:eq(2)').remove(); //找到前三个 td 去掉
alert(dd.html());
第一步,外层一定要加上 <tr>,不然转为 jquery 对象是 只会转第一个 <td>,后面的都没有了,而且我试了,外面 加<div> 也不行,外面 加<table>可以,不过它会自动在table下面加上 一层 tbody ,再加一层 tr
后来总结下,可以转为 jquery 对象时,外层必须加上一层,而且要符合 html 代码的规则,就好比 td 外面要 加 tr
相关文章推荐
- jquery与后台进行数据交互--前台发单一数据对象,后台返回一个json字符串 jsp页面
- jquery与后台进行数据交互--前台发单一数据对象,后台返回一个json字符串 serlet
- jquery与后台进行数据交互--前台发单一数据对象,后台返回一个json字符串 serlet配置页面
- Jquery 局部刷新及 表单取值赋值 处理返回json数据 一些基本操作
- Jquery 将后台返回的字符串转换成Json格式的数据
- Jquery 局部刷新及 表单取值赋值 处理返回json数据 一些基本操作
- 针对后台返回Object 对象数据的操作
- 使用jQuery POST提交数据返回的JSON是字符串不能解析为JSON对象
- Jquery 局部刷新及 表单取值赋值 处理返回json数据 一些基本操作
- js操作Json数据,JSON对象与字符串转化 - jack_Meng - 博客园
- 遍历表格中的input转化为json数据传到后台解析实现一些操作
- .net 互操作之p/invoke- 数据封送(字符串版本-ANSI和UniCode,返回错误码,回调函数,常量)(6)
- .net 互操作之p/invoke- 数据封送(字符串版本-ANSI和UniCode,返回错误码,回调函数,常量)(6)
- Js操作后台返回的json数据
- struts2 + ajax(由前台的form提交数据到后台,再根据form所调用返回获取的后台json格式的数据返回到前端,然后前端用jquery对json数据进行解析)==》》涉及文件上传的部分
- 后台将对象转换为json格式,前台js解析json数据,将字符串转化为数组
- jQuery查询数据返回object和字符串影响原因是什么
- JQuery操作后台返回的JSON
- js中字符串数据转为json对象的方法
- struts2:JSON在struts中的应用(JSP页面中将对象转换为JSON字符串提交、JSP页面中获取后台Response返回的JSON对象)