2014年07月16日

2014 07.16 Wed


ページ内もしくはサイト内の全ての当てはまるURLアドレスを、自動で新しいURLアドレスへ書き換えるスクリプトを考察。
条件に合致していれば、部分的に追加したり削除したり置換変更したりするのが目的です。

例えば、
相対URLから絶対URL(またはその逆)へ全て張り替え
・引っ越す前の旧URLから引越し先の新URLへドメイン部分のみを全て書き替え
・該当するURLのリンクのみ「target="〜"」を書き換え(または削除)
・アフィリエイトリンクを新URLへ全て張り替え
などが一発で書き換えられます。

ただし、DOMソースを後からスクリプトで上書きするので、SEO的には書き換え前のソースが採用される可能性が高いです。
スクリプトがオフの訪問者に対しても旧アドレスが表示されます。


ケース1

idで範囲を指定する場合
var id=$('#id1')[0];
id.innerHTML=id.innerHTML.replace(RegExp('hoge1',"ig"),'hoge2');

結果:成功
これが一番シンプルで表示速度も速いです。

この要領でidをbodyに変更してみました。
var id=$('body')[0];
id.innerHTML=id.innerHTML.replace(RegExp('hoge1',"ig"),'hoge2');

結果:失敗
リンクの書き換え自体は成功しましたが、ページ全体を再描画しているようで表示完走がとても遅くなります。
画像や他scriptファイルなども再読み込みしているようでした。



ケース2

idまたはclassの複数セレクタをまとめて範囲指定、さらにアンカーリンクを指定
$('#id1 a, #id2 a, .class1 a, .class2 a').each(function(){
var url=$(this).attr('href').replace(/hoge1/,'hoge2');
$(this).attr('href', url);
});

結果:成功(△)
サイトAでは理想的な結果を得られました。
サイトBでは「.attr('href')」が「Nullまたはオブジェクトが無効」のスクリプトエラーが返ってきました。

bodyに置き換えて、
$('body a').each(function(){
var url=$(this).attr('href').replace(/hoge1/,'hoge2');
$(this).attr('href', url);
});

結果:成功(△)
やはりサイトBではエラーが返ってきました。
ちなみに$('body').find('a')より$('body a')の方が速いです。



ケース3

アンカーリンクのURLアドレスを条件に指定します。
$('a[href^="http://hoge1.com/"]').each(function(){
var url=$(this).attr('href').replace(/hoge1/,'hoge2');
$(this).attr('href', url);
});

結果:成功
サイトA・Bともにエラーなし。




アンカーリンクの条件の指定いろいろ

$(“a[href]“)
aタグのhref属性がある要素を選択

$(“a[href = '#pagetop']“)
aタグのhref属性の値が「#pagetop」の要素を選択

$(“a[href != '#pagetop']“)
aタグのhref属性の値が「#pagetop」でない要素を選択

$(“a[href ^= '#link']“)
aタグのhref属性の値が「#link」から始まる要素を選択

$(“a[href $= 'bottom']“)
aタグのhref属性の値が「bottom」で終わる要素を選択

$(“a[href *= 'page']“)
aタグのhref属性の値に「page」が含まれている要素を選択

参考:jQuery – いろんなセレクタ指定方法+αを覚えて、目的の要素をさくっと取得する



正規表現の文字列置換のコツ

例:
http://hoge1.com/ac=zzz?d

http://hoge2.jp/ac=zzz?e

検索文字列
var hoge1=/hoge1\.com\/(a|b)c=([^"]+)\?d/i;

/     検索文字列は「"〜"」や「'〜'」ではなく「/〜/」で囲む
()     (〜)は置換文字列へストックされる
(a|b)   aまたはb
[^"]   「"」以外の文字
+     直前の文字の繰り返し
i     大文字・小文字問わず

置換文字列
var hoge2='hoge2\.jp/$1c=$2\?e';

$1     1つ目の(〜)を代入

お疲れさまでした。
参考になりましたらソーシャルメディアで共有してくださいませ。
posted by こさめ
edit  re
カテゴリ
インターネット>ブラウザ・WEBメール(24)
インターネット>Firefoxアドオン、設定(15)
インターネット>Proxomitronフィルター(32)
インターネット>ブログ、WEBサービス(53)
インターネット>アフィリエイト・ポイントサイト(27)
インターネット>楽天、ポイントあれこれ(5)
インターネット>Windows最適設定(32)
インターネット>インターネット設定(17)
インターネット>デスクトップ改造・拡張(7)
インターネット>セキュリティソフト(6)
ブログカスタマイズ>カテゴリー、記事一覧系(38)
ブログカスタマイズ>jQuery(Script)文字系(23)
ブログカスタマイズ>CSS(Script)デザイン(28)
ブログカスタマイズ>ブログパーツ(7)
ブログカスタマイズ>携帯モバイル系(3)
ブログカスタマイズ>SEO・アクセスアップ(31)
マルチメディア>Brackets(5)
マルチメディア>画像系ソフト(6)
マルチメディア>DVD・動画プレイヤー(15)
マルチメディア>動画編集ソフト(6)
マルチメディア>音楽再生プレイヤー(16)
マルチメディア>ネットラジオ配信・編集(3)
マルチメディア>P2Pテレビソフト(4)
マルチメディア>おもしろ動画・感動動画(25)
デザイン>フリー素材 画像(5)
デザイン>HP・ブログ フリー素材(6)
デザイン>イラスト(非素材)(8)
デザイン>作詞作曲編曲MP3(5)
雑記>PC部品・音楽機材(7)
雑記>映画・アニメ・漫画・芸能(14)
雑記>どうでもいい雑学知識(6)
雑記>ゲーム(6)
雑記>スマホ・携帯電話(6)
雑記>カーナビ・ETC(3)
雑記>ネット銀行とか(2)
雑記>18禁?ちょいエロネタ(3)

 (C) 2006 - kosame All rights.