使用 jQuery 为属性设置新值

Shiv Yadav 2022年6月15日
使用 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。当你在浏览器中运行此代码时,你将看到以下内容:

运行代码后

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

谷歌主页

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

看看下面的截图:

Youtube 主页

作者: Shiv Yadav
Shiv Yadav avatar Shiv Yadav avatar

Shiv is a self-driven and passionate Machine learning Learner who is innovative in application design, development, testing, and deployment and provides program requirements into sustainable advanced technical solutions through JavaScript, Python, and other programs for continuous improvement of AI technologies.

LinkedIn