1

我不知道如何将 target="_blank" 属性添加到 5 星评级徽章。

这是我插入网页的内容...来自yelp。我将最后一行添加到脚本中以尝试添加属性，但它不会接受。但是，我可以让它在之前的 div 和之后的 img 上接受，而不是在锚标签上。 

<div class="localsocialyelpreviews"><div id="yelp-biz-badge-fsc-N6ciVLIYpasN2FWN3Nxy9Q">Gina's Pizza & Pastaria</div><script type="text/javascript">
!function(doc, id){
  var js;
  var scriptElement = doc.getElementsByTagName("script")[0];
  if (!doc.getElementById(id)) {
    js = doc.createElement("script");
    js.id = id;
    js.src = "//dyn.yelpcdn.com/biz_badge_js/fsc/N6ciVLIYpasN2FWN3Nxy9Q.js";
    scriptElement.parentNode.insertBefore(js, scriptElement);
  }
} (document, "yelp-biz-badge-script-fsc-N6ciVLIYpasN2FWN3Nxy9Q");
$("div#yelp-biz-badge-fsc-N6ciVLIYpasN2FWN3Nxy9Q > a").attr("target","_blank");</script></div>

这就是最终发生的事情。没有目标属性：/

<div class="localsocialyelpreviews">
<div id="yelp-biz-badge-fsc-N6ciVLIYpasN2FWN3Nxy9Q"><a href="http://www.yelp.com/biz/ginas-pizza-and-pastaria-corona-del-mar"><img width="125" height="55" src="http://dyn.yelpcdn.com/extimg/fsc/N6ciVLIYpasN2FWN3Nxy9Q.png" alt="Gina's Pizza &amp; Pastaria"></a></div>
<p><script type="text/javascript">
!function(doc, id){
  var js;
  var scriptElement = doc.getElementsByTagName("script")[0];
  if (!doc.getElementById(id)) {
    js = doc.createElement("script");
    js.id = id;
    js.src = "//dyn.yelpcdn.com/biz_badge_js/fsc/N6ciVLIYpasN2FWN3Nxy9Q.js";
    scriptElement.parentNode.insertBefore(js, scriptElement);
  }
} (document, "yelp-biz-badge-script-fsc-N6ciVLIYpasN2FWN3Nxy9Q");
$("div#yelp-biz-badge-fsc-N6ciVLIYpasN2FWN3Nxy9Q &gt; a").attr("target","_blank");</script></p></div>

我很欣赏任何见解。我尝试了很多不同的方法，并在 yelp 和 stackoverflow 中寻找解决方案，但找不到答案。谢谢

4

4 回答 4

2

修改 yelp 提供的脚本以在脚本加载后设置 target='_blank' 属性。添加这个（一定要插入您的 YELP 代码）：

g.onload = function() {
    document.querySelector('#yelp-biz-badge-YOUR-YELP-CODE a').setAttribute('target', '_blank');
}

见下文：

<div id="yelp-biz-badge-YOUR-YELP-CODE">
    <a href="http://yelp.com/biz/YOUR-YELP-URL?utm_medium=badge_star_rating_reviews&amp;utm_source=biz_review_badge" target="_blank">
    Check out my biz on Yelp
    </a>
</div>
<script>(function(d, t) {
    var g = d.createElement(t);
    var s = d.getElementsByTagName(t)[0];
    g.id = "yelp-biz-badge-YOUR-YELP-CODE";
    g.src = "//yelp.com/biz_badge_js/en_US/YOUR-YELP-CODE.js";
    s.parentNode.insertBefore(g, s);

    g.onload = function() {
        document.querySelector('#yelp-biz-badge-YOUR-YELP-CODE a').setAttribute('target', '_blank');
    }

}(document, 'script'));
</script>
于 2017-02-10T01:57:25.023 回答
0

几个月前我一直在寻找答案并放弃了——我的 js 技能还没有达到那个水平。但是同样的问题又出现了，答案就在我眼前一闪而过——用我自己的透明链接盖住徽章。我将 yelp 脚本放在一个 div 中，并在脚本之后立即添加了我自己的链接。这是脚本之后的html：

<a href="http://www.yelp.com/biz/yourpage" target="_blank" class="yelp-button">My Yelp Page</a>

和CSS：

.yelp-button { background: transparent;
display: block;
height: 56px;
width: 125px;
position: absolute;
top: 0;
text-indent: -9999px;
}
于 2014-06-17T21:48:58.870 回答
0

我不知道你是否还需要这个问题的答案，但我有同样的问题并且能够弄清楚。

我不是 JavaScript 专家，但据我所知，默认的 Yelp！片段重新排序所有脚本，使其远程脚本位于队列的最后；因此，即使您的行位于 Yelp 代码之后，我认为您的“attr”修改行仍然会在远程 Yelp 脚本运行之前排队，该脚本实际上会创建<a\>您尝试修改的锚 () 对象。

我能够为我自己的网站清理片段，只需将“attr”修改放入我网站的“onReady”函数中。我无法想象这会影响 Yelp 的行为！以任何方式编写脚本；它与 Yelp 的代码片段完全一样，只是它没有在 JavaScript 执行管道的末尾对其进行排队。

<div id="yelp-link">
    <div id="yelp-biz-badge-script-plain-BlWbNrrOL4HJqwYcmr6SUw"></div>
    <script type="text/javascript" id="yelp-biz-badge-script-plain-BlWbNrrOL4HJqwYcmr6SUw" src="//dyn.yelpcdn.com/biz_badge_js/plain/BlWbNrrOL4HJqwYcmr6SUw.js">
    </script>
</div><!-- #yelp-link -->

... 稍后在我的 functions.js 文件中：

$(document).ready(function() {
   $("#yelp-link a").attr("target","_blank");
});

我希望这是有道理的，并有所帮助:-)

于 2013-10-02T07:09:09.600 回答
0

我找到了一种直接修复 javascript 的方法，所以这确实有效。

(1)：查看 yelp 为您的 Yelp 企业徽章/按钮提供的代码。将链接复制到脚本中引用的 *.js javascript 文件，并将本地副本保存在根目录中。你要修改它。

(2): 对于 *.js 文件的修改... 在 javascript 的 innerHTML 行中，在 href 链接之后添加以下代码：

\u003ca target=\"_blank\"

在 target=\"_blank\" 之前的\u003ca告诉 javascript 将target="_blank"放在 yelp 按钮的超链接/锚标记内。在\u003e\u003cimg文本之后写入的任何内容都将出现在 yelp 按钮的图像标签中。

因此，修改后的yelp-javascript-file.js的示例副本应如下所示：

var badge_element = document.getElementById("yelp-badge");
badge_element.innerHTML = "\u003ca href=\"http://www.yelp.com\" \u003ca target=\"_blank\" \u003e\u003cimg alt=\"Yelp\" src=\"http://dyn.yelpcdn.com/extimg/genericYelpBizButton.png\" height=\"33\" width=\"88\"\u003e\u003c/a\u003e";

(3)：现在，在 Yelp 提供的代码中...确保它指向您修改后的 javascript 文件，而不是原始 javascript 文件。对于指向 Yelp 的简单按钮，代码如下所示：

<div id="yelp-badge" title="Yelp Business Page">
<a href="http://yelp.com">Check out Yelp</a></div>

<script type="text/javascript">(function(d, t) {var g = d.createElement(t);var s = d.getElementsByTagName(t)[0];g.id = "yelp-badge-script";g.src = "yelp-javascript-file.js";s.parentNode.insertBefore(g, s);}(document, 'script'));</script>

（最终结果）：下面是脚本运行并出现您的按钮后加载的 html 的副本。是的...它在新窗口/新标签中打开。

<div id="yelp-badge" title="Yelp Business Page">
<a href="http://www.yelp.com" target="_blank">
<img alt="Yelp" src="http://dyn.yelpcdn.com/extimg/genericYelpBizButton.png" height="33" width="88">
</a>
</div>
于 2015-08-12T01:59:10.143 回答