Question

这是我的codepen https://codepen.io/syedsadiqali/full/BwaMEW。我试图通过freecodecamp创建一个Wikipedia查看器项目。除了来自维基百科API的片段之外，一切都运行良好，html实体无法解码，跨度标签无法被替换。我尝试了很多东西。请帮助。

HTML

      <div class="container">
  <div class="row row1">

    <div class="col-md-6 text-center">
      <div class="text-center">
      <h2 class="text-center">Welcome to <h2><h1><br> Wikipedia Viewer Project <br> </h1><h2>Search Something Random<br>or<br> Enter Value below.</h2>
        </div>
      <input type="text" id="querybox">
      <div>
      <button class="btn btn-primary" id="querybutton">Search</button>
        <div>
          <a class="btn btn-primary" href="https://en.wikipedia.org/wiki/Special:Random" target="_blank">Open Random Page</a>
        </div>

      <div class="data" id="put"></div>
      </div>
    </div>
    <div class="col-md-6">
      <div id="target" class="list-group"></div>
          <script type="x-tmpl-mustache" id="template">
          {{#search}}<a href="https://en.wikipedia.org/?curid={{pageid}}" target="_blank" class="list-group-item"><h4 class="list-group-item-heading">{{title}}</h4><p class="list-group-item-text">{{{snippet}}}</p></a>{{/search}}
</script>
        </div>
    </div>
      <div class="row">

      </div>
        <footer>
    <h3 class='text-center'>Made with love by <a href="https://www.facebook.com/2k16syed" target="_blank"> Syed </a> Source Code would be soon available to you on my <a href="https://www.github.com/syedsadiqali" target="_blank">Github</a></h3>
  </footer>
</div>

CSS

@import url('https://fonts.googleapis.com/css?family=Pacifico');
.row1{
  font-family:"Pacifico",sans-serif;
}
.btn{
  margin-top:10px;
  padding:20px;
  font-size:30px;
}
.row{
  margin-top:20px;
}
input{
  font-family:sans-serif!important;
}

的JavaScript

  $("#querybutton").on("click",function(){

  data=document.getElementById("put");          query=document.getElementById("querybox").value;
  url="https://wikipedia.org/w/api.php?action=query&format=json&prop=&list=search&srsearch=" + query + "&callback=?";
$.getJSON(url,function(json){

      var view=json.query;

  var template = document.getElementById('template').innerHTML;
  Mustache.parse(template);

    // render the data into the template
    var rendered = Mustache.render(template,view);

    //Overwrite the contents of #target with the rendered HTML
    document.getElementById('target').innerHTML = rendered;


});
});

结果

https://codepen.io/syedsadiqali/full/BwaMEW

Answer 1

正如@Paul Abbott评论我需要使用{{{snippet}}}三重胡子来将Object中的数据呈现为HTML。谢谢你的回答，这个答案我刚才写的是关闭这个问题正确答案由@PaulAbbott提供。再次感谢。

如何解码html实体，我无法这样做？

1 个答案: