Question

我在js文件中使用javascript，如下所示：

document.body.onclick = function(ev) {
    alert(this.getAttribute("href"));
};

但该代码给了我null。

我不想使用jQuery。例如$(this).attr('href');

你有更好的建议吗？我想在用户点击任意href代码时获得最后<a>。

Answer 1

您尝试执行的操作称为event delegation，但是，您尝试通过this访问点击的元素。这可能在jQuery中有效，但在常规JavaScript事件中（例如通过绑定到onclick属性或使用addEventListener）this引用您绑定事件的对象，即在这样的代码中，this始终引用<body>：

＆＃13;

document.body.onclick = function(ev) {
  console.log("onclick variant — `this` is", this);
};

document.body.addEventListener("click", function(ev) {
  console.log("addEventListener variant — `this` is", this);
});

＆＃13;

<div>Click me to see what <code>this</code> refers to.</div>

＆＃13;

要查看实际点击了哪个元素，简而言之，您需要ev.target：

＆＃13;

document.body.onclick = function(ev) {
  console.log("onclick variant — `ev.target` is", ev.target);
};

document.body.addEventListener("click", function(ev) {
  console.log("addEventListener variant — `ev.target` is", ev.target);
});

＆＃13;

<div>Click me to see what <code>this</code> refers to.</div>

＆＃13;

使用addEventListener，因为它更现代，允许绑定多个事件侦听器，并提供对事件传播的更多控制。

Answer 2

你可能想写这样的东西：

#!/usr/bin/perl

use strict;
use warnings;

use List::MoreUtils qw(uniq);
use List::Util 'first';
use Data::Dumper;

my $filename        = "/data/Test/output.txt";
my $output_filename = "/data/Test/output_changed.txt";

my @resultarray;
my @sorted;

open( TXT2, "$filename" );
while ( <TXT2> ) {
    push( @resultarray, $_ );
}
close( TXT2 );

foreach ( @resultarray ) {
    chop( $_ );
}

foreach ( @resultarray ) {
    print( $_);
    chomp( $_ );
    my ( $key, $val ) = split /\t/, $_, 2;
    push @{ $result_hash{$key} }, $val;
}

foreach ( sort { $result_hash{$a} <=> $result_hash{$b} } keys %result_hash ) {
    push( @final_array, $_ . "\t" . join "\t", @{ $result_hash{$_} } );
}

undef %{result_hash};

foreach ( @final_array ) {
    chomp( $_ );
    print( $_);
}

for ( 0 .. @final_array - 1 ) {

    my $myuniquearray = $final_array[$_];
    open( MYFILE, ">>$output_filename" );    ##opens files with header and adds the rest of the lines.

    print MYFILE $myuniquearray . "\n";
    close( MYFILE );
}

注意：
var links = document.getElementsByTagName('a'); for (var i = 0; i < links.length; i++) { links[i].addEventListener('click', function () { alert(this.href); }); }也适用，但是 - 如评论中所述 - 您选择了一个this.getAttribute('href');项，它没有document.body属性。

Answer 3

您的代码有效，但正文没有href属性。但是使用这样：

var elems = document.querySelectorAll("a")
var onClick = function (event) {
    alert(event.target.getAttribute("href"));
}
elems.forEach((el) =>{
    el.addEventListener("click", onClick);
});

Javascript：this.getAttribute（“href”）不起作用

3 个答案: