使用 Javascript/jQuery 访问具有不正确 id 属性的 HTML 元素答案

【问题标题】：Using Javascript/jQuery to access HTML elements with improper id attribute使用 Javascript/jQuery 访问具有不正确 id 属性的 HTML 元素
【发布时间】：2011-01-02 14:43:28
【问题描述】：

我正在为某人制作一个 Greasemonkey 脚本来更改他们的 CRM(Zoho) 创建的某些字段的显示，因为他们无权更改呈现的 HTML。

这应该很容易，但是 Zoho 认为创建正确的 HTML 太让人头疼了，我猜，他们的 HTML 包含如下内容：

<input type="text" maxlength="50" style="width: 100%;" class="textField" id="property(Phone)" name="property(Phone)"/>

ID 包含空格和括号，它们在 ID 属性中无效，并且阻止我使用 document.getElementById() 来选择它们或使用 jQuery 来选择它们。

有人对我如何获取该元素有任何想法吗？显然，我可以通过其父元素中的索引或遍历 DOM 来获取它，但这两者都意味着如果字段的顺序发生变化，Greasemonkey 脚本将停止正常工作，因为它会定位错误的元素.

【问题讨论】：

标签： javascript jquery html zoho

【解决方案1】：

你可以像这样转义括号：

$("#property\\(Phone\\)")

【讨论】：

你领先了我一分钟，但你忘记了选择器开头的“#”。 :)

【解决方案2】：

你总是可以做一个 document.getElementsByTagName('input')，然后浏览结果并将其与它的属性相匹配（比如它的类型和名称、类...）。效率不高，但我知道的唯一方法适用于任何订单（因为 id 无效）...

var inputs = document.getElementsByTagName('input');
if (inputs)
    for (var i = 0; i < inputs.length; i++)
        if (inputs[i].type == 'text' && inputs[i].name == 'SearchValue')
            return inputs[i];

我很确定 JQuery（或任何其他好的框架）具有与此 sn-p 等效的功能...

【讨论】：

【解决方案3】：

您可以使用反斜杠转义空格和括号：

$('#property\\(Phone\\)').val('jQuery selected property(Phone)!');
$('#ab\\ cd\\ ef').val('jQuery selected ab cd ef!');

【讨论】：

【解决方案4】：

这是什么浏览器？ Firefox，我想，因为你提到了 GreaseMonkey。但document.getElementById("property(Phone)") 似乎在 Firefox 3.5 中运行良好。

【讨论】：

【解决方案5】：

JQuery 可能无法使用#id 语法找到它，但可能会使用 tagName[id=value] 语法找到它……试试吧，祝你好运。请参阅jQuery doc。

【讨论】：