Javascript获取自定义按钮的文本值

I have a button that is defined as follows :

我有一个按钮,定义如下:

<button type="button" id="ext-gen26" class=" x-btn-text">button text here</button>

and I'm trying to grab it based on the text value, however, none of it's attributes contain the text value. It's generated in a pretty custom way by the look of it.

我试图根据文本值抓取它,但是,它的所有属性都不包含文本值。它的外观以一种非常自定义的方式生成。

Does anyone know of a way to find this value programatically, besides just going through the html text? Other than attributes?

有没有人知道以编程方式找到这个值的方法,除了通过html文本?属性除外?

Forgot one other thing, the id for this button changes regularly, and using jquery to grab it results in breaking the page for some reason. If you need any background on why I need this, let me know.

忘了另外一件事,这个按钮的id会定期更改,并且使用jquery抓取它会导致因某种原因破坏页面。如果您需要任何背景知道我需要这个,请告诉我。

This is the javascript I am trying to grab it with:

这是我试图抓住它的javascript:

var all = document.getElementsByTagName('*'); 
for (var i=0, max=all.length; i < max; i++) 
{
var elem = all[i];
if(elem.getAttribute("id") == 'ext-gen26'){
    if(elem.attributes != null){
        for (var x = 0; x < elem.attributes.length; x++) {
            var attrib = elem.attributes[x];
            alert(attrib.name + " = " + attrib.value);  
        }
    }
}
};

It only comes back with the three attributes that are defined in the code.

它只返回代码中定义的三个属性。

innerHTML, text, and textContent all come back as null.

innerHTML,text和textContent都返回null。

2 个解决方案

#1

If you're trying to locate the button entirely by its text content, I'd grab a list of all buttons and loop through them to find this one:

如果你试图完全按照文本内容找到按钮,我会抓住所有按钮的列表并循环浏览它们以找到这个按钮:

function findButtonbyTextContent(text) {
  var buttons = document.querySelectorAll('button');
  for (var i=0, l=buttons.length; i<l; i++) {
    if (buttons[i].firstChild.nodeValue == text)
      return buttons[i];
  }  
}

Of course, if the content of this button changes even a little your code will need to be updated.

当然,如果此按钮的内容发生变化,您的代码将需要更新。

#2

You can do that through the textContent/innerText properties (browser-dependant). Here's an example that will work no matter which property the browser uses:

您可以通过textContent / innerText属性(依赖于浏览器)来实现。这是一个无论浏览器使用哪个属性都可以使用的示例:

var elem = document.getElementById('ext-gen26');
var txt = elem.textContent || elem.innerText;
alert(txt);

http://jsfiddle.net/ThiefMaster/EcMRT/

You could also do it using jQuery:

你也可以使用jQuery来做到这一点:

alert($('#ext-gen26').text());

#1