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');
    });
}

这不是全部，而只是它的主要部分。也许它是一个sytax错误......也许它不是。谢谢。

编辑：我添加了这个功能，而我真正想要做的就是改变颜色的过渡。

Answer 1

attr method获取或设置HTML属性：

console.log($('#Easy').attr('id')); // Should output "Easy"

$('#Easy').attr('id', 'new-id'); // Updates id to "new-id"

如果是您的代码，则不清楚您使用.attr('id')的原因;因为它返回字符串'Easy'，后续的.css(...)调用将无效。如果您正在尝试更改 ID（调用函数的setter重载），那么设置CSS 的链接调用将工作。如果您不需要更改ID，请完全删除.attr('id')。

Answer 2

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>

Answer 3

如果您想要更改具有＆＃34; easy＆＃34;的元素的背景颜色。 ID：

这是应该的：

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

#表示id选择器。

如果您想知道点击了哪个按钮：

$("button").click(function(){
    alert( $(this).attr("id") );
});

Answer 4

使用.attr()方法，我们可以获取并更改任何HTML元素的属性值，例如，如果您想获取类名，那么

var className = $("#id").attr("class");

我们也可以像这样操纵任何锚标签的href属性：

$("#anchorTagId").attr("href","about.html");

在您的代码中没有任何语法错误，但方法不正确，如果您只想更改background-color，那么您应该尝试这样：

$("#Easy").css("background-color","red"); //if you want to change single css property

否则

$("#Easy").css({"background-color":"red","width":"200px"}); //if you want to change multiple css properties.

Answer 5

以下是一些快速提示，特别是关于您的代码示例：

// if you want to get an element with the ID 'Easy', create a selector that begins with a #
$(document).ready(function(){
    var el = $('#Easy');
});
// if you want to set a CSS attribute
$(document).ready(function(){
    $('#Easy').css("background-color", "red");
});
// if you want to set an HTML element attribute
$(document).ready(function(){
    $('#Easy').attr("foo", "bar");
});
// result: <button id="Easy" onmouseover="rolloverb1()" onmouseout="rolloverb2()" value="Javascript" href="#" foo="bar">Easy</button>

Answer 6

$('#Easy').attr("id")返回当前ID。 $('#Easy').attr("id", "hard")将现有ID更改为hard，$('#Easy').attr("id", function(index, past){ return past+"money"; })将ID更改为“easymoney”。

.attr方法如何工作（我不理解API）

6 个答案: