jQuery 循环遍历可能的元素来查看它们是否存在?

发布于 2024-10-16 19:03:25 字数 504 浏览 1 评论 0原文

我有一些像这样的 jQuery:

$('#mydiv1').css('color', 'red');
$('#mydiv2').css('color', 'blue');
$('#mydiv3').css('color', 'green');
$('#mydiv4').css('color', 'orange');
$('#mydiv5').css('color', 'purple');

我认为它应该是这样的,所以它仅在元素存在时才起作用:

if ($('#mydiv1').length) {.css('color', 'red')}
if ($('#mydiv2').length) {.css('color', 'blue')}
if ($('#mydiv3').length) {.css('color', 'green')}
...

是否有更好的方法来检查元素是否存在,使用此命名约定?类似“for every #mydiv(n)”之类的东西?

I have some jQuery like this:

$('#mydiv1').css('color', 'red');
$('#mydiv2').css('color', 'blue');
$('#mydiv3').css('color', 'green');
$('#mydiv4').css('color', 'orange');
$('#mydiv5').css('color', 'purple');

I think it should be this, so it only acts if the element exists:

if ($('#mydiv1').length) {.css('color', 'red')}
if ($('#mydiv2').length) {.css('color', 'blue')}
if ($('#mydiv3').length) {.css('color', 'green')}
...

Is there a better way to check if the elements exist, with this naming convention? Something like a 'for each #mydiv(n) ' ?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

痕至 2024-10-23 19:03:25

使用 jQuery 不需要检查元素是否存在。如果没有找到匹配的元素,它不会做任何事情。

如果您想要的是一种将 CSS 应用于遵循该模式的所有 ID 的更短方法,那么您可以这样做:

var colors = ['red', 'blue', 'green', 'orange', 'purple'];
for (var i = 0; i < 5; i++) {
    $('#mydiv' + (i+1)).css('color', colors[i]);
}

如果您想按文档顺序(元素在 HTML 中出现的顺序)应用这些颜色,您可以利用 jQuery 的 < a href="http://api.jquery.com/attribute-starts-with-selector/" rel="nofollow">attribute-starts-with 选择器

$('[id^=mydiv]').each(function (i) {
    $(this).css('color', colors[i]);
});

Checking if the element exists is not necessary with jQuery. It won't do anything if no matched elements are found.

If what you want is a shorter way to apply the CSS to all IDs following that pattern, then you can do:

var colors = ['red', 'blue', 'green', 'orange', 'purple'];
for (var i = 0; i < 5; i++) {
    $('#mydiv' + (i+1)).css('color', colors[i]);
}

If you want to apply those colors in document order (the order the elements appear in the HTML), you can utilise jQuery's attribute-starts-with selector:

$('[id^=mydiv]').each(function (i) {
    $(this).css('color', colors[i]);
});
睫毛溺水了 2024-10-23 19:03:25

jQuery 函数 ($) 返回元素集合(绝不是 nullundefined 值),因此如果对于给定的选择器,集合的 length 为 0,代码(在您的情况下为 .css() 调用)将不会被执行,或者导致类似 < code>null 引用异常。

The jQuery function ($) returns a collection of elements (never a null or undefined value), so if for a given selector the length of the collection is 0, the code (in your case the .css() call) will not be executed, or cause anything like a null reference exception.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文