1 
$('.email').each(function(l,i){
    var that = $(this);
    var thatOtherOne = $(this:after);
    $('<a>').attr('href', 'mailto: '+ that.html + thatOtherOne.css('content')).insertAfter(that);
    that.hide();
});

.email:after {
    content: "@mydomain.com";
}

<span class="email">info</span>

こんにちは再びスタックオーバーフロー！

これが私のスパム対策です。:afterセレクターにCSS を使用しcontent、カスタム メールを内部に入力しようとする<span>と、css が URL を追加します。ただし、これではクリックできません。そのため、JS/jQuery を使用して上記の方法を試します。

$(this:after);は有効なセレクターではないため、残念ながら機能しません。どうすればこれを変更できますか?

4

1 に答える 1

3

そのようなセレクターを構築することはできません。本当に構文的に意味がありません。セレクターは、DOM を検索するためのものです。やろうとしていることを行うにはattr()、「コンテンツ」でトリックを使用してみてください。

.email:after {
  content: attr(data-domain);
}

次に、マークアップで：

  <a class=email data-domain='@whatever.com'>info</a>

そして、あなたの JavaScript はこれを行うことができます:

$('.email').each(function(l,i){
    var that = $(this);
    var domain = that.data('domain');
    $('<a>').prop('href', 'mailto: ' + that.text() + domain).insertAfter(that);
    that.hide();
});

コードで実際に使用する必要があるものを別の属性に保持attr()し、CSS ルールで演算子 (または任意の名前) を使用してその属性値を取得し、それをコンテンツとして使用するという考え方です。必要に応じて、演算子を文字列と組み合わせることができます。Chris Coyierは、それについての良いブログ記事を書いています。

于 2013-08-11T22:42:09.220 に答える