如何更改博客JSON Feed网址？

时间：2017-12-06 17:19:28

标签： json blogger feed

我正在使用来自SITE1的博客json提要数据，代码包含document.write（SITE1feedurl）。

我正在使用它没有问题。 但现在我想将json feed的url更改为 document.write（SITE2feedurl）点击而不刷新页面， 所以我创建了函数change（）;所以在点击它加载document.write（Site2feedurl）。

它有效，但问题是 document.write用从site2加载的内容替换整页。 所以我开始知道这是document.write的缺点，所以document.write的替换是InnerHTML和Jquery的$ Div.append（''），两者都可以，但是只显示来自博客列表的第一个项目

当我们用类似的东西替换document.write并且仍然显示超过1个帖子时，这可能会有用。 尝试过很多东西，无法得到它。从来没用过它。救命。 这是代码：

代码演示现场：http://ytlmega.bitballoon.com/food/temp

代码如下：

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>



<button onclick="go();">Click to change src of json feed url</button>
<div class="idli" id="idli" style="background-color:yellow"> Please Notice that , After you click button : The new content replaces ENTIRE page (due to document.write)</div>

<hr/><hr/>



<script type="text/javascript" async>
var ListBlogLink = window.location.hostname; 
var ListCount = 0; 
var ChrCount = 140; 
var TitleCount = 1000; 
var ImageSize = 500; 
//################ Function Start 
function mbtlist(json) { 
document.write('<div class="mbtlist">'); 
for (var i = 0; i < ListCount; i++) 
{ 
//################### Variables Declared 
var listing= ListImage = ListUrl = ListTitle = ListImage = ListContent = ListConten = ListAuthor = ListTag = ListDate = ListUpdate = ListComments = thumbUrl = TotalPosts = sk = ListMonth = Y = D = M = m = YY = DD = MM = mm = TT =  "";
//################### Category 
if (json.feed.entry[i].category != null) 
{ 
for (var k = 0; k < json.feed.entry[i].category.length; k++) { 
    ListTag += json.feed.entry[i].category[k].term; 
if(k < json.feed.entry[i].category.length-1) 
{ ListTag += ", ";} 
} 
}
//################### URL 
for (var j = 0; j < json.feed.entry[i].link.length; j++) { 
      if (json.feed.entry[i].link[j].rel == 'alternate') { 
        break; 
      } 
    } 
ListUrl= "'" + json.feed.entry[i].link[j].href + "'";
//################### Info 
TotalPosts = json.feed.openSearch$totalResults.$t; 
if (json.feed.entry[i].title!= null) 
{ 
ListTitle= json.feed.entry[i].title.$t.substr(0, TitleCount); 
} 
if (json.feed.entry[i].thr$total) 
{ 
ListComments= json.feed.entry[i].thr$total.$t; 
} 
ListAuthor= json.feed.entry[i].author[0].name.$t.split(" "); 
ListAuthor=ListAuthor.slice(0, 1).join(" ");

//################### Content Check
ListConten = json.feed.entry[i].content.$t; 
ListContent= ListConten.replace(/(<([^>]+)>)/ig,"").substring(0, ChrCount);
//################### Date Format
ListMonth= ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"];
ListDate= json.feed.entry[i].published.$t.substring(0,10);
                         Y = ListDate.substring(0, 4); 
                        m = ListDate.substring(5, 7); 
                         D = ListDate.substring(8, 10); 
                         M = ListMonth[parseInt(m - 1)];                       
ListUpdate= json.feed.entry[i].updated.$t.substring(0, 16);
                         YY = ListUpdate.substring(0, 4); 
                        mm = ListUpdate.substring(5, 7); 
                         DD = ListUpdate.substring(8, 10); 
                         TT = ListUpdate.substring(11, 16); 
                         MM = ListMonth[parseInt(mm - 1)];   
//################### Thumbnail Check 
// YouTube scan
if (json.feed.entry[i].content.$t.match(/youtube\.com.*(\?v=|\/embed\/)(.{11})/) != null) 
{
    var youtube_id = json.feed.entry[i].content.$t.match(/youtube\.com.*(\?v=|\/embed\/)(.{11})/).pop(); 

    if (youtube_id.length == 11) { 
        var ListImage = "'//img.youtube.com/vi/"+youtube_id+"/0.jpg'"; 
        } 
}
else if (json.feed.entry[i].media$thumbnail) 
{ 
thumbUrl = json.feed.entry[i].media$thumbnail.url; 
sk= thumbUrl.replace("/s72-c/","/s"+ImageSize+"/"); 
ListImage= "'" + sk.replace("?imgmax=800","") + "'"; 
}
else if (json.feed.entry[i].content.$t.match(/src=(.+?[\.jpg|\.gif|\.png]")/) != null) 
{ 
// Support For 3rd Party Images 
ListImage =  json.feed.entry[i].content.$t.match(/src=(.+?[\.jpg|\.gif|\.png]")/)[1]; 
} 
else 
{ 
ListImage= "'../ext/404.png'"; 
} 
//################### Printing List
var listing = "<div  style='padding:13px'><div  id='mains' class='card ' style='border-radius:9px'><div class='card-image' ><div   style='animation-delay:0.5s' class='animated bounceIn node"+[i]+"' ><a class='primary progressive replace' href=" 
+ ListImage+ 
  "> <img  style='margin-top:-1px;margin-right:-1px;' data-src=" 
  +ListImage+ 
  "  ></div></a></div><div class='card-content ' ><span style='cursor: pointer;font-size:42px;font-family:mont;float:right;padding:7px;color:#78d0fe;' class='add'>+</span> <span style='color:#78d0fe;border-radius:200px;padding:4px;cursor: pointer;font-size:42px;align:right;font-family:mont;float:right' class='minus'>-</span> <input style='padding:4px;border-radius:1.5px;background-color:#e9e9e9;color:#016aa3;width:30px;height:20px;' type=number class='qty' id='book-qty' value='1' disabled></input><div   class='add-to-cart' style='background-color:#ff6f00;border-radius:4px;height:30px;padding:5px;float:right;width:110px;color:white;margin-left:14px;margin-bottom:10px;cursor:pointer'  onclick='myAdded()' class='chip'>   <b  style='background-color:#ff6f00;color:#fff;font-family:mont'> &#8226; Add to cart</b></div><br/><span class='card-title activator grey-text text-darken-4'><a class='mbttitle' style='padding:0px;color:#212121;font-family:mont;align:left' =" 
+ ListUrl+ 
"><p id='book-name' >" 
+ ListTitle+ 
"</p>   </a></span><br/><hr class='style12' style='margin-bottom:5px'><div style='margin-bottom:0px;margin-top:0px;margin-left:0px;font-size:18px;'> <div style='background-color:#fff   ;color:#212121;height:18.8px;width:100%;font-family:mont;font-size:21.7px' class='chip'> <img width='120px' src='https://image.flaticon.com/icons/svg/592/592015.svg' ><p id='book-content'>" 
+ListContent+ 
"</p></div></div></div></div></div></div>"; 
document.write(listing); 
} 
document.write("<div class='itotal'><span> <a href='"+ListBlogLink+"/search'>View all <font>"+TotalPosts+"</font> posts</a></span></div></div>"); 
} 

var ListBlogLink = "http://viofd.blogspot.in/"; 
var ListCount = 1000; 

document.write("<script src='"+ListBlogLink+"/feeds/posts/default/?alt=json-in-script&max-results=1000&callback=mbtlist'></"+"script>"); 

function go(){
document.write("<script src='"+ListBlogLink+"/feeds/posts/default/?alt=json-in-script&max-results=2&callback=mbtlist'></"+"script>"); 
}
</script>







</body>
</html>

1 个答案:

答案 0 :(得分：0)

经过多次尝试，最后Jquery的追加方法似乎是最有效的方法。 这是博客json，它与document.write一起放置，因此当使用任何其他方法时只显示1个帖子。很明显需要替换document.write。 但现在将jquery添加到正确的位置和[i ++]循环内部，并在追加之前清除div。

以下是解决方案后的工作代码：

//################### Printing List
var listing = "<div  style='padding:13px'><div  id='mains' class='card ' style='border-radius:9px'><div class='card-image' ><div   style='animation-delay:0.5s' class='animated bounceIn node"+[i]+"' ><a class='primary progressive replace' href=" 
+ ListImage+ 
  "> <img  style='margin-top:-1px;margin-right:-1px;' data-src=" 
  +ListImage+ 
  "  ></div></a></div><div class='card-content ' ><span style='cursor: pointer;font-size:42px;font-family:mont;float:right;padding:7px;color:#78d0fe;' class='add'>+</span> <span style='color:#78d0fe;border-radius:200px;padding:4px;cursor: pointer;font-size:42px;align:right;font-family:mont;float:right' class='minus'>-</span> <input style='padding:4px;border-radius:1.5px;background-color:#e9e9e9;color:#016aa3;width:30px;height:20px;' type=number class='qty' id='book-qty' value='1' disabled></input><div   class='add-to-cart' style='background-color:#ff6f00;border-radius:4px;height:30px;padding:5px;float:right;width:110px;color:white;margin-left:14px;margin-bottom:10px;cursor:pointer'  onclick='myAdded()' class='chip'>   <b  style='background-color:#ff6f00;color:#fff;font-family:mont'> &#8226; Add to cart</b></div><br/><span class='card-title activator grey-text text-darken-4'><a class='mbttitle' style='padding:0px;color:#212121;font-family:mont;align:left' =" 
+ ListUrl+ 
"><p id='book-name' >" 
+ ListTitle+ 
"</p>   </a></span><br/><hr class='style12' style='margin-bottom:5px'><div style='margin-bottom:0px;margin-top:0px;margin-left:0px;font-size:18px;'> <div style='background-color:#fff   ;color:#212121;height:18.8px;width:100%;font-family:mont;font-size:21.7px' class='chip'> <img width='120px' src='https://image.flaticon.com/icons/svg/592/592015.svg' ><p id='book-content'>" 
+ListContent+ 
"</p></div></div></div></div></div></div>"; 
$(idli).append(listing); 
} 

} 

var ListBlogLink = "http://viofd.blogspot.in/"; 
var ListCount = 1000; 

</script>

<script>
function go1(){

$(idli).html('');
$(idli).append("<script src='"+ListBlogLink+"/feeds/posts/default/?alt=json-in-script&max-results=3&callback=mbtlist'></"+"script>"); 
}

</script>


<script>
function go2(){

$(idli).html('');
$(idli).append("<script src='"+ListBlogLink+"/feeds/posts/default/-/drinks?alt=json-in-script&max-results=3&callback=mbtlist'></"+"script>"); 
}

</script>

现在， go1（）函数定义了来自site1的url，go2（）定义了site2 ..等等。 的解决！

相关问题
最新问题