jQuery: .attr(); メソッドを使用して 2 つの属性を追加する 質問する

jQuery: .attr(); メソッドを使用して 2 つの属性を追加する 質問する

編集:

以外の値を使用すると_blank、モバイル ブラウザーで新しいウィンドウ/タブを開くことができないことがわかりました。

たとえば、新しいウィンドウ/タブを開く必要がある場合:

  • これはうまくいくすべてのブラウザ(モバイルブラウザも含む)で:target="_blank"

  • これは動作しませんモバイルブラウザでは動作するデスクトップブラウザの場合: target="new".

--

私はこれを動作させていますが、それを実行するより良い方法があるかどうか、または私が得た方法が正しい/唯一の方法であるかどうかはわかりません。

基本的に私が行っているのは、target="_new"またはtarget="_blank"属性値をすべて に置き換えることですtarget="nw"。こうすることで、複数のウィンドウでユーザーを圧倒しないように、新しいウィンドウが 1 つだけ開き、その中で他のすべての新しいウィンドウが開きます。

新しいウィンドウで開く"title=""属性。

そこで私が作成した解決策は次のとおりです。

$("a[target='_blank'], a[target='_new']").attr('target','nw').attr('title','Opens in a new window');

2つの.attr();方法に注目してください。

これは要素に 2 つの属性を追加する正しい方法ですか?

試してみました.attr('target','nw','title','Opens in a new window')が、うまくいきませんでした。

私が質問する理由は、DYR (Don't Repeat Yourself) の原則のためです。したがって、コードを改善できれば素晴らしいですが、そうでない場合は、現状のままです。

ありがとう。

ベストアンサー1

動作するはずです:

.attr({
    target:"nw", 
    title:"Opens in a new window",
    "data-value":"internal link" // attributes which contain dash(-) should be covered in quotes.
});

注記:

複数の属性を設定する場合、属性名を囲む引用符はオプションです。

警告: 'class' 属性を設定するときは、常に引用符を使用する必要があります。

jQueryのドキュメント(2016年9月)より.属性:

document.createElement() で作成された input 要素または button 要素の type 属性を変更しようとすると、Internet Explorer 8 以前では例外がスローされます。

編集:
今後の参考のために...シングルを取得する使用する属性

var strAttribute = $(".something").attr("title");

単一に設定する使用する属性

$(".something").attr("title","Test");

複数設定属性はすべて { ... } で囲む必要があります

$(".something").attr( { title:"Test", alt:"Test2" } );

編集 - チェックボックスから「チェック済み」属性を取得/設定しようとしている場合...

使用する必要があるのはprop() jQuery 1.6以降

.prop() メソッドはプロパティ値を明示的に取得する方法を提供し、.attr() は属性を取得します。

...checked 属性について覚えておくべき最も重要な概念は、それが checked プロパティに対応していないということです。この属性は実際には defaultChecked プロパティに対応しており、チェックボックスの初期値を設定するためだけに使用してください。チェックされた属性値はチェックボックスの状態によって変化しませんが、チェックされたプロパティは変化します。

するチェック済みのステータスを取得するチェックボックスの場合は、次のようにします。

$('#checkbox1').prop('checked'); // Returns true/false

あるいはチェックボックスをオンまたはオフに設定する次のように使用してください:

$('#checkbox1').prop('checked', true); // To check it
$('#checkbox1').prop('checked', false); // To uncheck it

おすすめ記事