Home > スポンサー広告 > User JavaScriptの練習 - ボタンを追加

スポンサーサイト

スポンサー広告

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Comments:-

Comment Form

Trackback+Pingback:-

TrackBack URL for this entry
http://karafuto50.blog117.fc2.com/tb.php/45-cd895260
Listed below are links to weblogs that reference
スポンサーサイト from Karafuto Blog

Home > スポンサー広告 > User JavaScriptの練習 - ボタンを追加

Home > user javascript > User JavaScriptの練習 - ボタンを追加

User JavaScriptの練習 - ボタンを追加

user javascript

Opera User JavaScriptの練習です。

Google検索に I'm Feeling Luckyボタンを追加する

Google 検索の検索ボタンの隣に I'm Feeling Luckyボタンを作成する。検索クエリを入力して I'm Feeling Luckyボタンをクリックすると、I'm Feeling Luckyが実行される。

I'm Feeling Luckyは最初にヒットしたサイトのページを開く。

// ==UserScript==
// @include http://www.google.co.jp/search*
// @include http://www.google.com/search*
// @exclude
// ==/UserScript==

document.addEventListener('load', function() {
    var btnG = document.getElementsByName( 'btnG');
    var btnG1 = btnG[0];
    // 検索ボタンの複製
    var btnI = btnG1.cloneNode( false);
    btnI.name = 'btnI';
    btnI.value = "I'm Feeling Lucky";
    // I'm Feeling Luckyボタンの挿入
    btnG1.parentNode.insertBefore( btnI, btnG1.nextSibling );

    btnI.addEventListener('click', function() {
        var a = document.getElementsByName( 'q');
        var word = a[0].value;
        // 表示言語を取得
        a = document.getElementsByName('hl');
        var hl = a[0].value;
        // 特定の検索言語があれば取り出す
        a = document.getElementById('il');
        var lr = '';
        if ( a &&  a.checked ) {
            lr = a.value;
        }

        // I'm Feeling Luckyの URI
        var url = 'http://www.google.com/search?btnI=I%27m+Feeling+Lucky&ie=UTF-8&oe=UTF-8&hl=' +
                   hl + '&q=' + word + '&lr=' + lr;
        location.href = url;
    }, false);
}, false);
  1. cloneNode()で検索ボタンをコピーする。
  2. insertBefore()で検索ボタンの後にコピーから作成した I'm Feeling Luckyボタンを追加する。( nextSiblingは後ろのノードを返す)
  3. addEventListener()で I'm Feeling Luckyボタンにイベントリスナーを登録。
  4. I'm Feeling Luckyボタンがクリックされると、イベントリスナーが実行される。フォームから情報を取り出し、GoogleのI'm Feeling Luckyのページに行く。

Googleに日本語ナビ( Browse By Name)ボタンを追加する

Google 検索の検索ボタンの隣に Browse By Nameボタンを作成する。検索クエリを入力して Browse By Nameボタンをクリックすると、 Browse By Nameが実行される。

日本語ナビ( Browse By Name)は入力したキーワードがサイトと完全にマッチしたときだけサイトへジャンプする。マッチしなかった場合は通常の検索結果が表示される。

ユーザーが公式サイトに行けるようする機能だということらしい。

3分LifeHacking:“公式”ページを調べる方法 - ITmedia Biz.IDに日本語ナビ( Browse By Name)の例があります。

// ==UserScript==
// @include http://www.google.co.jp/search*
// @include http://www.google.com/search*
// @exclude
// ==/UserScript==

document.addEventListener('load', function() {
    var btnG = document.getElementsByName( 'btnG');
    var btnG1 = btnG[0];
    var btnI = btnG1.cloneNode( false);
    btnI.name = 'btnI';
    btnI.value = 'Browse By Name';
    btnG1.parentNode.insertBefore( btnI, btnG1.nextSibling );

    btnI.addEventListener('click', function() {
        var a = document.getElementsByName( 'q');
        var word = a[0].value;
        // 表示件数が設定されていれば取り出す
        a = document.getElementsByName( 'num');
        var num = '';
        if ( a[0] ) {
            num = a[0].value;
        }
        // 表示言語を取り出す
        a = document.getElementsByName('hl');
        var hl = a[0].value;
        // 特定の検索言語があれば取り出す
        a = document.getElementById('il');
        var lr = '';
        if ( a && a.checked ) {
            lr = a.value;
        }

        //  Browse By Nameの URI
        var url = 'http://www.google.com/search?num=' + num + '&ie=UTF-8&sourceid=navclient&gfns=1&hl=' + 
                   hl + '&q=' + word + '&lr=' + lr;
        location.href = url;
    }, false);
}, false);

上記のGoogleに I'm Feeling Luckyボタンを追加するスクリプトと違うのは、3箇所です。

ボタンの名前を'Browse By Name'に変えた。

btnI.value = 'Browse By Name';

GoogleのURIのパラメータに表示件数を追加した。

var a = document.getElementsByName( 'num');
var num = '';
if ( a[0] ) {
    num = a[0].value;
}

GoogleのURIを I'm Feeling Luckyから Browse By Nameに変えた。

var url = 'http://www.google.com/search?num=' + num + '&ie=UTF-8&sourceid=navclient&gfns=1&hl=' + 
           hl + '&q=' + word + '&lr=' + lr;

Comments:0

Comment Form

Trackback+Pingback:0

TrackBack URL for this entry
http://karafuto50.blog117.fc2.com/tb.php/45-cd895260
Listed below are links to weblogs that reference
User JavaScriptの練習 - ボタンを追加 from Karafuto Blog

Home > user javascript > User JavaScriptの練習 - ボタンを追加

おまかせリンク(R)
全記事表示リンク
Search
Meta
Feeds

Page Top

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。