2

hrefリンクの一部でリンクをたどる前に、JavaScriptで何かをしようとしています:

<a href="open.this.page" onclick="doStuff(this);return false; title="follow me">

質問は、in とは何thisをdoSuff(this)指しているのかということです。アンカーの一部を取り出さなければならないと思っていましたが、調べてみるとそれはそうであり、他には何もないhrefように見えます。href

function doSutff(my_arg) {
   alert (my_arg);
   // do stuff
   // follow the href in the link
}

上記のアラートでは、正確にhrefasを取得し"http://my.domain/open.this.page"ます。

これは予想されることですか、それともあるブラウザでは取得できますが、別のブラウザでは取得できない可能性がありますか?

それが通常の動作である場合、たとえば、アンカーのrelまたは一部を取得するにはどうすればよいでしょうか? titleドムだけ？

4

3 に答える 3

4

この場合this、DOM ノードを参照します。

于 2012-12-12T15:21:43.353 に答える
3

thisイベント (onclick またはそれ以外) のコンテキストでは、イベントをトリガーした DOM 要素を参照します。

あなたの場合、それはアンカータグそのものです。

于 2012-12-12T15:21:57.823 に答える
3

「上記のアラートでは、正確にhrefas "http://my.domain/open.this.page".

これは予期されていることですか、それともあるブラウザーでは取得できますが、別のブラウザーでは取得できない可能性がありますか?」

これは予期されることです。"http://my.domain/open.this.page"アラートが表示される理由は、それが要素のデフォルト.toString()値であるためです。<a>

異常なケースです。他の要素は、表現として属性を示しません.toString()。

を実際に使用したい場合はhref、 を実行するかthis.toString()、以下を参照してください...

「...たとえば、アンカーの REL または TITLE 部分を取得するにはどうすればよいでしょうか?」

他の属性やプロパティを取得するには、通常の方法で行います。

属性を取得するには、次のようにします。

onclick="doStuff(this.getAttribute('title')); return false;"

ほとんどの標準アトリビュートはノードのプロパティに直接マップされるため、次のようにすることもできます。

onclick="doStuff(this.title); return false;"

または、インラインハンドラーにいるので、実際にこれを行うことができます:

onclick="doStuff(title); return false;"

最後のものが機能する理由は、属性から割り当てられたハンドラーが、要素自体を含む一意のスコープ チェーンを持っているためです。これは、要素のプロパティが実際に変数として表示されることを意味します。

これは、他の種類のイベント ハンドラーでは機能しないことに注意してください。

に関してthisは、ハンドラがバインドされている要素を参照します。

属性に何が起こるかというと、それは基本的に、onclickプロパティに割り当てられた関数の本体になります。

したがって、次のような結果になります。

elem.onclick = function(event) {
    doStuff(this);return false; // Your onclick attribute value
}

したがって、this実際には、プロパティに割り当てられたイベント ハンドラーで見つかった通常の値であることがわかります。

eventパラメータが定義されていることにも注意してください。これは、次のように属性を変更できることを意味します。

onclick="doStuff(this, event);return false;"

...そして、関数が次のようになるため、そのパラメーターが渡されます。

elem.onclick = function(event) {
    doStuff(this, event);return false; // Your onclick attribute value
}

eventしたがって、文字列が実際に関数の通常のパラメーターを参照していることがわかります。

これは、古い IE でも機能します。IE では、eventパラメーターは定義されないため、グローバルeventオブジェクトが取得されます。

      // ---------------v----no parameter
elem.onclick = function() {

                //   v---now it picks up the global event
    doStuff(this, event);return false; // Your onclick attribute value
}
于 2012-12-12T15:23:34.817 に答える