تعريف متغير واستخدامه داخل وظيفة أخرى بواسطة جافا سكريبت
يوجد لدي سكربت قمت بتطويره يقوم بجلب أخر المشاركات من مدونات بلوجر أو اخر المشاركات من قسم معين
ما أريده هو التحكم في قيمة المعرف (demo) وربطه بالمتغير printId الموجود ضمن الوظيفة createLastPosts
بحيث يتم استدعاء هذه الوظيفة مع تحديد المعرف اللى هيتم طباعة البيانات بداخلها حتى اتمكن من استخدام هذه الوظيفة عدة مرات وفي أماكن مختلفة
function lastPosts(json) {
var jfe = json.feed.entry;
for (i = 0; i < jfe.length; i++) {
var jfei = jfe[i];
for (j = 0; j < jfei.link.length; j++) {
if (jfei.link[j].rel == "alternate") {
break;
}
}
var postUrl = jfei.link[j].href;
var postTitle = jfei.title.$t;
var thumbnail;
var thumbnailDefualt = "#";
try {
thumbnail = jfei.media$thumbnail.url;
} catch (h) {
s = jfei.content.$t;
a = s.indexOf("<img");
b = s.indexOf('src="', a);
c = s.indexOf('"', b + 5);
d = s.substr(b + 5, c - b - 5);
if (a != -1 && b != -1 && c != -1 && d != "") {
thumbnail = d;
} else {
thumbnail = thumbnailDefualt;
}
}
var fixThumbnail = thumbnail.replace("s72-c", "s1600");
var printThumbnail =
'<a class="grid-thumbnail" href="' +
postUrl +
'"><img class="lazyload" loading="lazy" src="' +
fixThumbnail +
'" alt="' +
postTitle +
'"></a>';
var printArticle =
'<article class="grid-col article-posts swiper-slide"><div class="grid-fix-height"><div class="grid-box">' +
printThumbnail +
'<div class="grid-content"><h3 class="grid-title"><a href="' +
postUrl +
'">' +
postTitle +
"</a></h3></div></div></div></article>";
var printall = document.getElementById("demo");
printall.innerHTML += printArticle;
}
}
function createLastPosts(url, count, printId) {
var createScript = document.createElement("script");
var createAttrSrc = document.createAttribute("src");
createAttrSrc.value =
url +
"/feeds/posts/default?alt=json-in-script&max-results=" +
count +
"&callback=lastPosts";
createScript.setAttributeNode(createAttrSrc);
document.getElementsByTagName("head")[0].appendChild(createScript);
}
function createLastPostsLabel(url, labelName, count) {
var createScript = document.createElement("script");
var createAttrSrc = document.createAttribute("src");
createAttrSrc.value =
url +
"/feeds/posts/default/-/" +
labelName +
"?alt=json-in-script&max-results=" +
count +
"&callback=lastPosts";
createScript.setAttributeNode(createAttrSrc);
document.getElementsByTagName("head")[0].appendChild(createScript);
}
<div id="demo1"></div> <div id="demo2"></div>
// أريد عند استدعاء الدالة
/*
createLastPosts(
'url', رابط المدونة
'count', عدد المقالات اللى هيتم طباعتها
'printId' المكان اللى هيتم طباعة فيه المقالات
);
*/
// مثال
createLastPosts(
'https://mo-222.blogspot.com',
'3',
'demo1'
);
صورة للتوضيح
التعليق السابق
function lastPosts(json) {
var jfe = json.feed.entry;
for (i = 0; i < jfe.length; i++) {
var jfei = jfe[i];
for (j = 0; j < jfei.link.length; j++) {
if (jfei.link[j].rel == "alternate") {
break;
}
}
var postUrl = jfei.link[j].href;
var postTitle = jfei.title.$t;
var thumbnail;
var thumbnailDefualt = "#";
try {
thumbnail = jfei.media$thumbnail.url;
} catch (h) {
s = jfei.content.$t;
a = s.indexOf("<img");
b = s.indexOf('src="', a);
c = s.indexOf('"', b + 5);
d = s.substr(b + 5, c - b - 5);
if (a != -1 && b != -1 && c != -1 && d != "") {
thumbnail = d;
} else {
thumbnail = thumbnailDefualt;
}
}
var fixThumbnail = thumbnail.replace("s72-c", "s1600");
var printThumbnail =
'<a class="grid-thumbnail" href="' +
postUrl +
'"><img class="lazyload" loading="lazy" src="' +
fixThumbnail +
'" alt="' +
postTitle +
'"></a>';
var printArticle =
'<article class="grid-col article-posts swiper-slide"><div class="grid-fix-height"><div class="grid-box">' +
printThumbnail +
'<div class="grid-content"><h3 class="grid-title"><a href="' +
postUrl +
'">' +
postTitle +
"</a></h3></div></div></div></article>";
var printall = document.getElementById(selectId);
printall.innerHTML += printArticle;
}
}
// لاستدعاء أخر المقالات
function createLastPosts(url, count, printId) {
selectId = printId;
var createScript = document.createElement("script");
var createAttrSrc = document.createAttribute("src");
createAttrSrc.value =
url +
"/feeds/posts/default?alt=json-in-script&max-results=" +
count +
"&callback=lastPosts";
createScript.setAttributeNode(createAttrSrc);
document.getElementsByTagName("head")[0].appendChild(createScript);
}
// لاستدعاء أخر المقالات من قسم معين
function createLastPostsLabel(url, labelName, count,printId) {
selectId = printId;
var createScript = document.createElement("script");
var createAttrSrc = document.createAttribute("src");
createAttrSrc.value =
url +
"/feeds/posts/default/-/" +
labelName +
"?alt=json-in-script&max-results=" +
count +
"&callback=lastPosts";
createScript.setAttributeNode(createAttrSrc);
document.getElementsByTagName("head")[0].appendChild(createScript);
}
لاستخراج أخر المقالات
createLastPosts( "url", // رابط المدونة "count", // عدد المقالات "printId" // معرف الأي دي لطباعة المقالات بداخله );
مثال
createLastPosts( "https://mo-222.blogspot.com", // رابط المدونة "3", // عدد المقالات "demo" // معرف الأي دي لطباعة المقالات بداخله );
لاستخراج أخر المقالات من قسم معين
مثال
createLastPostsLabel( "https://mo-222.blogspot.com", "تكنولوجيا", "3", "demo1" );
مع العلم ما زالت المشكلة موجودة حتى الآن
لاحظ اين تستخدم append child يجب أن تضيف العناصر الجديدة على العنصر الذي له id بقيمة demo1 اي في السطر 529 ولا نضيفه ل head
التعليقات