有没有办法从字符串中将jquery映射文本用于json?

时间:2015-03-28 18:12:46

标签: javascript jquery html json

首先,我问这个问题是由于petfinder的API破坏了。我正在开发一个兔子救援应用程序(它的网络界面),需要一些petfinder的搜索结果。希望他们很快修复公共API,但同时我使用PHP加载搜索结果的html内容并将其转换为json以供我的前端显示。

我使用的当前方法是将页面加载到不可见的div标签中,并使用jquery选择器映射内容。但这并不高效,因为它还会从petfinder加载一些原始脚本和css文件。我希望能够直接操作字符串。

以下是一些例子:

原始代码结构:

<html>
  <head>
    ...
  </head>
  <body style="background:#ffffff">
    <style type="text/css">
      ...
    </style>
    <body bgcolor="#FFFFFF" text="#000000" >
      <table>
        ...
          ...
            <tr class = "pfrow2">
              <td><a href="//www.petfinder.com/petdetail/30773115" class="pflink" target="_blank">
                Billie Bunny
                </a>
              </td>
              <td>
                Rabbit
              </td>
              <td>
                Dutch
              </td>
              <td>
                Adult
              </td>
              <td>
                Small
              </td>
              <td class='legacy'>
                <a href="//www.petfinder.com/petdetail/30773115" target="_blank">
                <img src="//drpem3xzef3kf.cloudfront.net/photos/pets/30773115/1/?bust=1415669533&width=130" class="img pets" border="0">
                </a>
              </td>
            </tr>
            <tr class="pfrow1">
              <td><a href="//www.petfinder.com/petdetail/30891970" class="pflink" target="_blank">
                Barnabas Bunny
                </a>
              </td>
              <td>
                Rabbit
              </td>
              <td>
                Himalayan, New Zealand
              </td>
              <td>
                Young
              </td>
              <td>
                Medium
              </td>
              <td class='legacy'>
                <a href="//www.petfinder.com/petdetail/30891970" target="_blank">
                <img src="//drpem3xzef3kf.cloudfront.net/photos/pets/30891970/3/?bust=1421966387&width=130" class="img pets" border="0">
                </a>
              </td>
            </tr>
            ...

正如您所看到的,我真正需要的信息在tr class = "pfrow2"tr class = "pfrow1"之内。我想知道如果该类实际上在字符串中,我是否可以进行类似的抓取$(".pfrow2").map(function(){})

或者,我可以在pfrow2之前和pfrow1之后删除DOM吗?

BTW这是我当前的json输出(注意我改变了图像的宽度,因为我想使用更大的缩略图)。

[{
  name: "Billie Bunny",
  type: "Dutch",
  age: "Adult",
  size: "Small",
  thumb: "//drpem3xzef3kf.cloudfront.net/photos/pets/30773115/1/?bust=1415669533&width=300",
  link: "//www.petfinder.com/petdetail/30773115"
},{
  name: "Barnabas Bunny",
  type: "Himalayan, New Zealand",
  age: "Young",
  size: "Medium",
  thumb: "//drpem3xzef3kf.cloudfront.net/photos/pets/30891970/3/?bust=1421966387&width=300",
  link: "//www.petfinder.com/petdetail/30891970"
}]

1 个答案:

答案 0 :(得分:1)

我不知道如何直接制作字符串,但我能够为你剪掉行。假设data是你的php返回的结果。

var json = data.substring(data.indexOf('<tr class = "pfrow2">') - 21);
    json = json.substring(0,json.lastIndexOf('</td>') + 5);
    function widthChange() {
      if (json.indexOf('&width=130') != -1) {
        json = json.replace('&width=130','&width=300');
        widthChange();
      } else {
        console.log(json);
        // here you can inset json into your DOM
      }
    }
    widthChange();