javascriptを使ってtarget = "_ blank"をいくつかのリンクにのみ追加するには?

Is it possible to use JavaScript to add target="_blank" to all links that include the following in the URL: profile.php?id=

1

3 答え

次の作業が必要です:

var aElems = document.links;

for (var i=0,len = aElems.length; i

JS Fiddle demo.


Edited to improve the performance of the above code, removing document.links and replacing it with document.getElementsByTagName('a'):

var aElems = document.getElementsByTagName('a');

for (var i=0,len = aElems.length; i

JS Fiddle demo.


しかし、 Chris Fulstow querySelectorAll()が有効なコードを使用すると、 > $( 'a [href * = "profile.php?id ="] ")アプローチはわずかに高速です(Chromium 14/Ubuntu 11.04): JS Perfスピードテストを参照してください。したがって、以下は( querySelectorAll()をサポートするブラウザで)最も高速です。

var aElems = document.querySelectorAll('a[href*="profile.php?id="]');

for (var i=0,len = aElems.length; i

JS Fiddle demo.

Above assertion 'fastest' supported by JS Perf comparison, at least in Chromium 14/Ubuntu 11.04. Bear in mind, of course, that IE < 8, and Firefox 3, aren't going to play well with this approach.

もちろん、上記を修正する必要があります:

var aElems = document.querySelectorAll('a[href*="profile.php?id="]');

for (var i=0,len = aElems.length; i

JS Fiddle demo.

これは、 if 条件が querySelectorAll()によって既に評価されているためです。

変更された JS Perfの比較:http://jsperf.com/anchor-selector-test/3

4
追加された
それはどうもありがとう! (真剣にも、私のコメントであなたの答えを却下しようとはしていませんでした。jQueryであることを説明せずにjQueryコードを投稿しただけです... jQueryについてわからないと、 did not work。申し訳ありません。)
追加された 著者 David Thomas,
ネイティブなJSソリューションのためにここに+1を付けます。
追加された 著者 AlienWebguy,
うわー、あなたたちは速いです!どうもありがとうございました!
追加された 著者 Eyþór Sigurðsson,

もう1つのjQueryソリューションです。

$("a[href*='profile.php?id=']").attr("target", "_blank");
3
追加された
+1これは実際には非常に高速で、ただJSPerfで確認されています。
追加された 著者 AlienWebguy,

jQuery を使用するか、ソースを開き、ロジックを自分のコードベースに移植します:

$(function(){
    $('a').each(function(){
        var $this = $(this);
        if ($this.attr('href').indexOf('profile.php?id=') !== -1) {
            $this.attr('target','_blank');
        }
    });
});

Demo: http://jsfiddle.net/KJv7D/

1
追加された
あなたの答えがjQueryにリンクされていると説明したので、以前のコメントを削除しました。 +1の答え。
追加された 著者 David Thomas,
私は興味がありますが、自分でチェックする時間はありませんが、 JS Perf は異なるアプローチ?
追加された 著者 David Thomas,
document.links よりも速く document.getElementsByTagName( 'a')を使用する方が速いです(何か新しいことを学ぶことは、疑わしいが、テストされていない...): jsperf.com/anchor-selector-test/2 =)
追加された 著者 David Thomas,
@ RightSaidFred:良いキャッチ! =)男、私はJS Perfを時々..愛しています!
追加された 著者 David Thomas,
Meh。 OPがJQueryを知っていれば、彼はそのような簡単な質問をしないだろうと思う。
追加された 著者 AlienWebguy,
私は修正しました - SmartAssFredの回答は私たち(Chrome/Mac)@DavidThomasの両方よりも約300%高速です。 jsperf.com/anchor-selector-test
追加された 著者 AlienWebguy,
@ RightSaidFred私は深い不健全な偶像化のような方法で、精神に溢れています。
追加された 著者 AlienWebguy,
彼がjQueryを使用していた場合、よりよい解決策は $( 'a [href * = "profile.php?id ="]') '); OPがこの単純な作業を行う方法を知らない場合、jQueryのソースを見ることはあまり役に立ちません。
追加された 著者 RightSaidFred,
$( 'a [href * = "profile.php?id ="]')は有効な qSA セレクタであるため、Sizzleはほとんどのブラウザでは使用されません。そして、 qSA ブラウザでは、Sizzleは gEBTN を使用して、あなたが行っているフィルタを行い、各 要素そして、あなたが業績を上げようとしていたら、 $(document.links)したでしょう。私たちはJavaScriptを使っているので、実際には属性の代わりにプロパティを扱うべきです。だから、私はかなり良い仕事をしたと言えるでしょう。
@DavidThomas: document.links に興味がありましたが、1行のjQueryソリューションが qSA ソリューションより高速だったことに本当に驚いていました。しかし、あなたがすでに if(aElems [i] .href.indexOf( 'profile.php?id =')!= -1)そのフィルタは qSA セレクタにあります。それを削除すると、私が期待したより多くの結果が得られます。 jsperf.com/anchor-selector-test/3
追加された 著者 RightSaidFred,
ああ、AlienWebguyは彼のコメントを削除して、本当のスマートなお尻が誰かを隠すことができました。それはちょうど面白いです...あなたが本当に<私> Jean-Claude Van Damme でない限り、それは非常に賢明で狡猾な動きだったと言わなければなりません。 ;)
追加された 著者 RightSaidFred,
助けてくれてありがとう!
追加された 著者 Eyþór Sigurðsson,
JavaScript - 日本のコミュニティ
JavaScript - 日本のコミュニティ
2 参加者の

日本人コミュニティのjavascript