Maison  >  Article  >  développement back-end  >  Exemple de partage de code pour le traitement des liens hypertexte lors de la liaison d'un îlot de données XML

Exemple de partage de code pour le traitement des liens hypertexte lors de la liaison d'un îlot de données XML

黄舟
黄舟original
2017-03-24 17:05:591670parcourir

Lors de l'écriture d'une recherche dans l'espace cartographique, les résultats des données renvoyés par ajax doivent être répertoriés dans un tableau traditionnel en plus de la ponctuation sur la carte, et les informations peuvent être visualisées en cliquant, car le traitement des résultats renvoyés doit être suffisamment flexible pour que le format ne puisse pas être codé en dur en js. La méthode de l'îlot de données XML est utilisée ici (le système doit uniquement prendre en compte IE) et seules les informations de données XML à utiliser sont renvoyées. La mise en page spécifique sur la page HTML peut être personnalisée par d'autres développeurs.

Le code suivant supprime la partie ajax et montre simplement comment générer un îlot de données XML, comment le lier à une table HTML et afficher les informations de lien associées. Le contenu href du lien peut être enregistré dans des données XML et traité avec l'attribut datafld.

<html xmlns="">
<head>
  <title>XML数据岛</title>
</head>

<script type="text/jscript">...
  //获取xml,实际应用中大多是ajax异步获取的
  function getData()
  ...{
    var xmlData="<xml ID="xmlData"><root>";
    for(var i=0;i<5;i++)
    ...{
      try
      ...{
        var id="Name"+i;
        var Type="Type"+i;
         xmlData+="<METADATA><Name>"+id+"</Name> ;<Type>"+Type+"</Type><Href>javascript:aler t(&#39;"+id+"&#39;)</Href></METADATA>";
        pointIndex++;
      }
      catch(e)
      ...{

      }
    }
    xmlData+="</root></xml>";
    document.all.xmlDataPanel.innerHTML=xmlData;
  }
  //简单的添加xml信息
  function addData()
  ...{
    var xmlData= document.all.xmlDataPanel.innerHTML;
    xmlData=xmlData.replace ("</root></xml>","");
     xmlData+="<METADATA><Name>newName</Name><Type >newType</Type><Href>javascript:alert(&#39;newName&#39;) </Href></METADATA>";
    xmlData+="</root></xml>";
    document.all.xmlDataPanel.innerHTML=xmlData;
  }
</script>

<body>
  <button onclick="javascript:getData();">获取数据 </button>
  <button onclick="javascript:addData();">添加数据 </button>
  <div id="xmlDataPanel">
  </div>
  <div style="overflow: scroll; height: 180;width:180" align="center">
    <div align="left">
      <!--绑定,超链接的地方用 datafld属性,href的值也可以保存在 xml数据岛当中,比较灵活,可以使js函数或者一个url地址-->
      <table datasrc="#xmlData" border="1">
        <tr>
          <td>
            <a datafld="Href"><span datafld="Name"></span></a>
          </td>
          <td>
            <span datafld="Type"></span>
          </td>
        </tr>
      </table>
    </div>
  </div>

</body>
</html>

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn