通过字符串获取元素ID它包含使用纯正的Javascript

Question

如何根据包含的字符串获取元素ID？

<span id="th67">This the string I need to match</span> 

我无法使用JQuery或任何其他Javascript库来做到这一点。

我需要做一个硒测试。

我没有意识到如果没有我的图书馆，我在JS中没用！

谢谢大家的帮助。

Answer 1

好吧，如果你知道你要找什么样的标签对，你可以做：

var spans = document.getElementsByTagName('span'), targetId; 
for (var i = 0; i < spans.length; ++i) { 
    if (spans[i].innerText === stringToMatch) { 
    // found it ... 
    targetId = spans[i].id; 
    break; 
    } 
} 
if (targetId) { 
    // ... do whatever ... 
} 

如果你想获得看上你可以构造一个XPath查询，我猜。

Answer 2

这里有一个简单的递归函数，将做到这一点：

function findByText(node, text) { 
    if(node.nodeValue == text) { 
     return node.parentNode; 
    } 

    for (var i = 0; i < node.childNodes.length; i++) { 
     var returnValue = findByText(node.childNodes[i], text); 
     if (returnValue != null) { 
      return returnValue; 
     } 
    } 

    return null; 
} 

使用它作为：

var target = findByText(document, "This the string I need to match"); 

这将最终要么target是null，或者是其ID的DOM节点你可以得到target.id。

See it in action。

Answer 3

如果你的目标支持的XPath的浏览器，你可以做一个简单的XPath查询：

// Find an element by the text it contains, optionally 
// starting at specified parent element. 
function getElementByText(text, ctx) 
{ 
    return document.evaluate("//*[.='"+text+"']", 
    ctx || document, null, XPathResult.ANY_TYPE, null).iterateNext(); 
} 

然后只需运行

var myElement = getElementByText("This is the string I need to match"); 
if (myElement) 
{ 
    // do something with myElement.id 
}