js正则 获取元素属性值

JavaScript015

js正则 获取元素属性值,第1张

一、获取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]

}

1、用 childNodes 属性，按顺序取

实现过程：首先创建一个 xml 对象，然后载入 xml 文件，再根据待取节点父节点在 xml 文件中的序号和本身的序号，确定待取节点的位置，最后返回待取节点的值。

//pId 待取节点父节点序号

//cId 待取节点序号

function getXmlNodeValue(pId, cId) {

var xmlDoc = new ActiveXObject("Microsoft.XMLDOM")

xmlDoc.async = false

xmlDoc.load("employeeInfo.xml")

var nodes = xmlDoc.documentElement.childNodes[pId].childNodes[cId]return nodes.childNodes[0].text

}

调用方法：alert(getXmlNodeValue(1, 2))

2、用 for 循环来取

实现过程：首先创建一个 ie 支持的 xml 对象，如果发生异常，是创建一个 FireFox 支持的空 xml 对象并返回空；然后载入 xml 文件，如要发生异常也返回空；最后，通过 for 循环遍历查找与传入的节点值相同的节点，找到后返回属于该节点的属性值。

//nodeValue 待取节点的所属节点值

function getXmlNodeValueFor(nodeValue){

var xmlDoc　

try {　

//创建一个 ie 支持的 XML 文档对象　

xmlDoc = new ActiveXObject("Microsoft.XMLDOM")

}catch(e){

try{

//创建FireFox空的XML文档对象

xmlDoc=document.implementation.createDocument("","",null)

}catch(e){

alert(e.message)

return ""

}

}

xmlDoc.async = false

try {　

xmlDoc.load("employeeInfo.xml")

}catch(e){

alert(e.message)

return ""

}

var xd=xmlDoc.documentElement.childNodes

if(xd==null)

return ""

var tempValue

for(var i=0i<xd.lengthi++){

if(xd[i].childNodes[0].childNodes[0].nodeValue==nodeValue)tempValue=xd[i].childNodes[2].childNodes[0].nodeValue

}

return tempValue

}

调用方法：alert(getXmlNodeValueFor("王佳琳"))