jquery - .attr方法如何工作(我不明白API)

Question

嘿!

我只是想获取一个 id，并尝试使用 .attr 方法。这似乎不起作用。 .attr 方法(它是一个方法吗？)到底如何？这是不起作用的代码。

HTML:

    <div class="buttons">
        <div id="bgS">
        <button id="Easy" onmouseover="rolloverb1()" onmouseout="rolloverb2()" value="Javascript" href = "#">Easy</button>                              
        <button id="Intermediate" onmouseover="rolloveri1()" onmouseout="rolloveri2()" value="Css" href="#">Intermediate</button>
        <button id="Advanced" onmouseover="rollovera1()" onmouseout="rollovera2()" value="Html" href="#">Advanced</button>
    </div>

jQuery:

function rolloverb2() {
    var jbutton = document.getElementById("Easy");

    jbutton.style.backgroundColor = "#090";
    $(document).ready(function(){
        $('#Easy').css("transition", "0.5s").attr('button');
    });
}

这不是全部，只是主要部分。也许这是一个语法错误......也许不是。谢谢。

编辑:我添加了该功能，我真正想做的是更改颜色的过渡。

Answer 1

attr()获取或设置该属性。

如果你想知道<button id="Easy">的ID你可以得到它:

$('#Easy').click(function(){
   var tmp = $(this).attr('id');
   alert(tmp);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<button id="Easy">Easy button</button>

您要做的是设置#Easy元素的颜色:

$(document).ready(function(){
    $('#Easy').attr('id').css({
        "background-color":"red"                      
    });
});

$('button').hover(
  function(){
     //rolloverB1()
     $(this).css('background','pink');
  },
  function(){
     //rolloverb2()
    $(this).css('background','white');
  }
);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class="buttons">
  <div id="bgS">
    <button id="Easy" onmouseover="rolloverb1()" onmouseout="rolloverb2()" value="Javascript" href = "#">Easy</button>                              
    <button id="Intermediate" onmouseover="rolloveri1()" onmouseout="rolloveri2()" value="Css" href="#">Intermediate</button>
    <button id="Advanced" onmouseover="rollovera1()" onmouseout="rollovera2()" value="Html" href="#">Advanced</button>
  </div>