所以,这可能是一个错误...我输入错误的 CSS 路径来检查已处理的元素是否具有以 "ajaxLoad("
document.querySelectorAll( 'a[onclick^="ajaxLoad("' )
如您所见,我忘记使用 ]
关闭属性访问器,如下所示:
document.querySelectorAll( 'a[onclick^="ajaxLoad(]"' )
奇怪的是,它奏效了!
Edit - no I didn't, I actually ran the correct CSS selector:
document.querySelectorAll( 'a[onclick^="ajaxLoad("]' )
... but as mentioned in the comments apparently this further typo also works!
这显然是无效的。当我开始添加另一种类型的链接时,我发现了它,属于 tc-link
类,并且想知道我是否可以像在 CSS 样式表中那样将它链接起来:
document.querySelectorAll( 'a[onclick^="ajaxLoad(", a.tc-link' )
答案是您可以关闭括号,但不能留下这个错字。
Uncaught DOMException: Failed to execute 'querySelectorAll' on 'Document': 'a[onclick^="ajaxLoad(", a tc-link' is not a valid selector.
它适用于 ^=
、$=
和 *=
,据我所知,在 Firefox 或Opera(我没有任何其他浏览器可以测试)。
起初我认为这是一个语言怪癖,但修改了问题:任何人都可以算出 Javascript/浏览器代码的哪个级别(DOM?V8?呃.. webkit?我不太了解来龙去脉)这涉及到哪里可以报告/修复?
最佳答案
这主要是基于意见的,离确定的答案还差得很远。
浏览器极其复杂。完毕!没有什么是可以预测的。
首先,让我们分析一个错误的选择器列表:
a[onclick^="ajaxLoad("
(缺少]
)a[onclick^="ajaxLoad(]"
(缺少]
)a[onclick=""
(缺少]
)a[onclick="][onclick
(缺少"]
或缺少"
和]
基于你需要什么)a[onclick=""][onclick
(缺少]
)a[onclick="
(缺少"]
)a[onclick
(缺少]
)a:not([onclick]
(缺少)
)a:not([onclick
(缺少])
)a:not([onclick="
(缺少"])
)a:nth-child(5):not([onclick="
(缺少"])
)a:-webkit-any(:not([onclick="
(缺少"]))
)
到目前为止,这是找到的列表。我可以确认这些适用于 Windows 7 上的 Google Chrome 41.0.2272.89m。
注意到模式了吗?很简单:Chrome 仍然可以使用选择器通过填充基本的缺失字符来匹配元素,但只能在最后!
缺少的东西是可以预测的,不需要太多的努力来修复。
但并非每个选择器都可以/将被“修复”(例如:a,
,可以通过添加 *
来修复)。
这可能是一个错误或一个特性(又名,一个作为特性提交的令人尴尬的错误)来软化 CSS 引擎的渴望。这也会影响 jQuery,因为 jQuery 只使用 Sizzle如果 document.querySelectorAll()
不存在或抛出异常。
一段时间后,我们可以找到更多。
免责声明:
这种行为不应该被依赖并且可能在未来改变。
这一切都是基于无效选择器和无效语法(比如一些针对旧版本的 IE CSS Hacks)。 所有上面列表中的有效选择器都违反了规范。
作为示例给出的“未固定”选择器 (a,
) 在 jQuery 中有效,但这与此问题无关。本质上,jQuery 会将其作为 a
执行。
关于javascript - “*[attribute^="string""如何/为什么是有效的查询选择器?(JS 错误?),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29120822/