jquery中div[id=testing]和div[id$=testing]的区别

Question

<div id="testing">MY TEDT</div>
<div id="testing1">MY TEDT Number 1</div>
<div id="testing2">MY TEDT Number 2</div>

JQUERY

$('div[id=testing1]').css("display", "none");

我使用了上面的jquery代码来隐藏id测试的div。它很好用。请看下面的代码。

$('div[id$=testing1]').css("display", "none");

这段代码也会做同样的事情。我只想知道$在这里使用的目的是什么？因为没有$，它也可以正常工作。

小提琴演示

Answer 1

第一个选择id testing1的元素。它总是只选择一个元素。使用$('#testing1').css("display", "none");会更好，因为id是唯一的。

第二个代码将选择id元素，ending元素和testing1元素。这可以选择多个元素。

举例说明。第二个代码将选择一个id testtesting1的元素。因为它最终有了testing1。

Answer 2

在此：

$('div[id$=testing1]').css("display", "none");

$说，以testing1结尾的id用display:none;将css应用到它。

在正则表达式中，您经常看到以下字符：

^ : starts with
$ : ends with

因此，如果您有一个id元素，如下所示：

<div id="div-box">New Division</div>

这三种情况相似：

$('#div-box')
$('[id^="div"]')
$('[id$="box"]')

Answer 3

$('div[id=testing1]').css("display", "none");

选择id值为testing1的所有元素。

和

$('div[id$=testing1]').css("display", "none");

是匹配id值以testing1结尾的每个元素。