Facebook Like按钮代码如何工作,我该如何做类似的事情呢?

时间:2013-08-18 20:15:46

标签: javascript class html facebook-like

我有一个网页上有250个不同的项目,每个网页都有自己的Like按钮,使用标准的Facebook“赞”代码:

div class="fb-like" data-href="http://www.mywebpage.com/myproductpage" data-send="false" data-layout="button_count" data-width="80" data-show-faces="false" etc.

此页面适用于所有计算机平台以及Android设备上的所有浏览器。不幸的是,所有单独的Facebook Like按钮似乎都会为iPad和iPhone造成内存问题,Safari会在我们这些设备的页面上崩溃。

div class =“fb-like”等各个按钮的一部分不是我可以在我们的数千个页面上轻松更改以使iPad开心,但我可以轻松删除出现在顶部的标准Facebook代码使Like按钮工作的那些页面。我想做的是用我自己的HTML替换每个页面顶部的Facebook代码,这些HTML抓取每个“Like按钮”中的数据,并生成我自己的按钮,其功能有点不同。 (也许他们每个都会链接到一个单独的页面,当页面加载到iOS设备上时,它将成为共享页面。)唯一的问题是我不太了解导致每个项目所需的HTML / CSS / Javascript使用class =“fb-like”触发某些内容以在其中生成内容。我想这就是Facebook代码链接到带有Like按钮的页面顶部的内容。

有人可以简单地向我解释如何在我的页面的class =“fb-like”部分中访问数据,并将我自己的项目放在那里吗?然后,我可以动态地在iPad / iPhone上执行不同的操作,这样它们就不会崩溃,可能只需将类似按钮转换为共享页面链接即可。

我可以编写自己的Javascript / HTML代码就好了,但只有在我对如何访问每个“fb-like”DIV中的数据值以及如何使我生成的代码触发出现之后才知道在这250个地方的每一页上。

在我的页面的class =“fb-like”部分中访问数据然后在其中生成内容的任何示例将不胜感激。即使是最简单的例子也足以让我理解如何从那里编写任何我需要的东西。有人可以帮我开始吗?

1 个答案:

答案 0 :(得分:1)

根据穆罕默德的建议并在本网站上找到上述帖子,我为自己创建了一个似乎有用的小例子。此示例只访问每个Like按钮的data-href并将其放在该位置。这应该足以让我为iOS编辑剩余的已修改页面。这是我提出的代码,只是稍微改变了上面引用的页面以适合类似按钮类的Facebook:

<SCRIPT>
function replaceContentInContainer(matchClass) {
var elems = document.getElementsByTagName('*'), i;
for (i in elems) {
    if((' ' + elems[i].className + ' ').indexOf(' ' + matchClass + ' ')
            > -1) {
        elems[i].innerHTML = elems[i].getAttribute('data-href');
    }
}
}
replaceContentInContainer('fb-like');
</SCRIPT>