使用 jQuery 为属性设置新值

本文将演示如何使用 jQuery 为属性设置新值。

使用 jQuery 为属性设置新值

attr() 操作设置或返回已选择组件的属性和值。当用于替换属性值时,该函数传递第一个匹配元素的值。

此方法在用于设置属性值时为匹配项的集合设置一个或多个属性/值对。

语法:

$(selector).attr(attribute_name, new_value)

这里使用的 attr() 方法用于为属性设置一个新值,它接受属性名称和值等参数。

例子:

<html>
  <head>
    <title>Set New Attribute</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script>
      $(document).ready(function () {
        $("button").click(function () {
          $("#naya").attr("href", "https://www.youtube.com/");
        });
      });
    </script>
  </head>
  <body>
    <p><a href="https://www.google.com/" id="naya">ATT_Link</a></p>
    <button>new value</button>
    <p>
      first, you can view the link and then click on button new value. it will
      change the attribute value.
    </p>
  </body>
</html>

注意:将文件另存为 HTML 并在浏览器中运行以获得清晰的见解。

上面的示例显示属性的名称是 href,其新值是指向 youtube 的链接。选择器是一个设置了新值的标签。

这里使用的选择器是 naya,即带有 href 的角度标签的 id。当你在浏览器中运行此代码时,你将看到以下内容:

使用 jQuery 为属性设置新值

在这里,你可以看到一个链接和一个按钮。当你第一次单击该链接时,它将打开 google.com,如代码中所述。

使用 jQuery 为属性设置新值

之后,当你单击名为 new value 的按钮时,你会看到属性 href 的初始值更改为 youtube.com。点击按钮后,会触发 click 函数,然后借助 attr() 方法更改属性值。

看看下面的截图:

使用 jQuery 为属性设置新值