请问JavaScript怎么获取自定义标签的自定义属性值 ？

JavaScript020

请问JavaScript怎么获取自定义标签的自定义属性值 ？,第1张

在 JavaScript 中，可以使用 getAttribute() 方法来获取自定义标签的自定义属性值。

<my-tag data-custom-attribute="value"></my-tag>

<script>

var myTag = document.querySelector("my-tag")

var customAttributeValue = myTag.dataset.customAttribute

console.log(customAttributeValue)// Output: "value"

</script>

1、新建一个html文件，命名为test.html。

2、在test.html文件内，创建一个div模块，并设置其id属性为mydiv，用于下面使用js获得标签对象。

3、在test.html文件内，在div标签内，填写一段文字，并加入一个span标签。

4、在test.html文件内，创建一个button按钮，按钮名称为“获取html”。

5、给button绑定onclick点击事件，当按钮被点击时，执行myfun()函数。

6、在test.html文件内，在js标签内，创建myfun（）函数，在函数内，使用getElementById（）方法获得div对象，通过innerHMTL属性获得div内的html内容，最后，使用alert方法将获得的html内容以弹窗形式显示

7、在浏览器打开test.html文件，点击按钮，查看获得的html标签内容。

一、获取img标签的src属性值

var imgStr = "<p><img src='http://www.baidu.com/FpmF-JifNksQTHo7InP_LMukbtWc'/></p>"

//解析富文本获取img里面的src属性值

        var patt = /<img[^>]+src=['"]([^'"]+)['"]+/g

        var result = [],

          temp

        while ((temp = patt.exec(imgStr)) != null) {

          result.push({'url':temp[1]})

        }

console.log(result) //http://www.baidu.com/FpmF-JifNksQTHo7InP_LMukbtWc

二、获取指定元素属性值

function getDomAttr(str,tag,attr) {

  // const val = /(?<=data-value=").*?(?=")/

  var patt = `/<${tag}[^>]+${attr}=['"]([^'"]+)['"]+/g`

  let temp = patt.exec(str)

  // console.log('str.match(val)', temp)

  return temp[1]

}