JS和jQuery通过this获取html标签中的属性值(实例代码

【】JS与jQuery如何巧妙获取HTML标签中的属性值

在Web开发中，我们经常需要从HTML标签中获取属性值。今天，我将通过具体的实例代码，向大家展示如何使用JavaScript和jQuery来实现这一功能。此代码示例不仅实用，而且具有一定的参考价值，希望能对大家有所帮助。

让我们来看一下如何使用jQuery来获取HTML元素的属性值。假设我们有一个带有特定属性的HTML标签，我们可以通过jQuery的`.attr()`方法来轻松获取这些属性的值。例如：

```html

```

使用jQuery获取属性值的代码如下：

```javascript

function attrsByJquery(obj){

var v1 = $(obj).attr("dbname"); // 获取 dbname 属性的值

var v2 = $(obj).attr("name"); // 获取 name 属性的值

alert(v1); // 弹出 dbname 的值

alert(v2); // 弹出 name 的值

}

```

在上述代码中，我们定义了一个函数 `attrsByJquery`，它接受一个对象作为参数，并使用jQuery的 `.attr()` 方法来获取该对象的 `dbname` 和 `name` 属性值。然后，通过 `alert()` 函数将这两个属性值显示出来。

接下来，我们看一下如何使用纯JavaScript来获取HTML元素的属性值。同样地，我们可以使用 `getAttribute()` 方法来实现这一目标。示例代码如下：

```javascript

function attrsByJs(obj){

var v1 = obj.getAttribute('name'); // 获取 name 属性的值

var v2 = obj.getAttribute('dbname'); // 获取 dbname 属性的值

alert(v1); // 弹出 name 的值

alert(v2); // 弹出 dbname 的值

}

```

在这段代码中，我们定义了一个名为 `attrsByJs` 的函数，它接受一个DOM对象作为参数，并使用 `getAttribute()` 方法来获取该对象的 `name` 和 `dbname` 属性值。然后，通过 `alert()` 函数显示这些属性值。

我们还有一个 `attrsButtons` 函数，它用于处理一个带有特定属性的按钮点击事件。在这个函数中，我们不仅使用了 `getAttribute()` 方法来获取按钮的 `name` 属性值，还使用了 jQuery 的 `.attr()` 方法来获取一个名为 `myname` 的自定义属性值。示例代码如下：

```javascript

function attrsButtons(obj){

var v = obj.getAttribute('name'); // 获取 name 属性的值

var vv = $(obj).attr("myname"); // 获取自定义属性 myname 的值

alert(v); // 弹出 name 的值

alert(vv); // 弹出 myname 的值

}

```

在HTML部分，我们提供了三个带有不同属性和值的`