原版 javascript 前缀以 css 选择器开头
vanilla javascript prefix begins with css selector
有没有人知道 运行 [class^='xyz-'] css 选择器在 vanilla js 中搜索的可靠方法,总体上没有任何库dom 没有关闭浏览器?
基本上是 $('[class^="xyz-"]').length 检查而不使用 jQuery... 它只需要找到一个出现并且可以休息;紧接着。
谢谢!
编辑:应该是跨浏览器和移动设备,可能是 ie7+
您可以将其与 querySelector
结合使用。
document.querySelector("[class^='xyz-']");
如果您需要多个元素,您也可以使用 querySelectorAll
执行此操作。
这是一个 JSFiddle,它将把项目记录到控制台中。
使用 XPath 非常简单。也更快。
var xpathResult = document.evaluate(
'count(//div[starts-with(@class, "xyz-")])',
document,
null,
XPathResult.ANY_TYPE, null);
snippet.log(xpathResult.numberValue);
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<div></div>
<div class="xyz-foo"></div>
<div class="bar"></div>
<div></div>
慢速选项(我相信 IE6+):
function getElementsByClassNamePrefix(prefix) {
var els = document.getElementsByTagName("*");
var result = [];
for (var i = 0; i < els.length; i++) {
if (els[i].className.substr(0, prefix.length) == prefix) {
result.push(els[i]);
}
}
return result;
}
snippet.log(getElementsByClassNamePrefix('xyz-').length);
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<div></div>
<div class="xyz-foo"></div>
<div class="bar"></div>
<div></div>
有没有人知道 运行 [class^='xyz-'] css 选择器在 vanilla js 中搜索的可靠方法,总体上没有任何库dom 没有关闭浏览器?
基本上是 $('[class^="xyz-"]').length 检查而不使用 jQuery... 它只需要找到一个出现并且可以休息;紧接着。
谢谢!
编辑:应该是跨浏览器和移动设备,可能是 ie7+
您可以将其与 querySelector
结合使用。
document.querySelector("[class^='xyz-']");
如果您需要多个元素,您也可以使用 querySelectorAll
执行此操作。
这是一个 JSFiddle,它将把项目记录到控制台中。
使用 XPath 非常简单。也更快。
var xpathResult = document.evaluate(
'count(//div[starts-with(@class, "xyz-")])',
document,
null,
XPathResult.ANY_TYPE, null);
snippet.log(xpathResult.numberValue);
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<div></div>
<div class="xyz-foo"></div>
<div class="bar"></div>
<div></div>
慢速选项(我相信 IE6+):
function getElementsByClassNamePrefix(prefix) {
var els = document.getElementsByTagName("*");
var result = [];
for (var i = 0; i < els.length; i++) {
if (els[i].className.substr(0, prefix.length) == prefix) {
result.push(els[i]);
}
}
return result;
}
snippet.log(getElementsByClassNamePrefix('xyz-').length);
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<div></div>
<div class="xyz-foo"></div>
<div class="bar"></div>
<div></div>