Yelp 5星級評論徽章在新窗口中打開

Question

我不知道如何將target =“ _ blank”屬性添加到5星評級徽章。

這是我插入網頁的內容……來自yelp。 我在腳本中添加了最后一行以嘗試添加屬性，但它不會接受。 但是，我可以使它在div之前的div以及img之后的img上都可以接受，而不僅僅是在anchor標簽上。

<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中搜索了解決方案，但找不到答案。 謝謝

Answer 1

修改yelp提供的腳本，以在加載腳本后設置target ='_ blank'屬性。 添加此內容（請確保輸入您的“青年代碼”）：

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>

Answer 2

我不知道您是否仍然需要答案，但是我有同樣的問題，並且能夠解決。

我不是JavaScript專家，但據我所知，默認的Yelp！ 片段對所有腳本進行重新排序，以便其遠程腳本位於隊列的盡頭； 因此，即使您的代碼行位於Yelp代碼之后，我認為您的“ attr”修改行仍在排隊， 直到運行實際創建要修改的錨對象（ <a\\> \\>）的遠程Yelp腳本之前 。

我能夠清理自己網站的代碼段，然后將“ 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");
});

我希望這是有道理的，對您有所幫助：-)

Answer 3

我幾個月前一直在尋找答案，但放棄了-我的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;
}

Answer 4

我找到了一種修復JavaScript的直接方法，因此這實際上可行。

（1）：查看yelp為您的Yelp業務徽章/按鈕提供的代碼。 將鏈接復制到腳本中引用的* .js javascript文件，然后將本地副本保存在根目錄中。 您將要對其進行修改。

（2）：對於* .js文件修改...在javascript的innerHTML行中，在href鏈接之后添加以下代碼：

\u003ca target=\"_blank\"

target = \\“ _ blank \\”之前的\\ u003ca告訴javascript將ye =“ =” 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>