Use native pseudo-selectors instead of jQuery selectors (#24713)

diff --git a/docs/4.0/components/alerts.md b/docs/4.0/components/alerts.md
index aa6dfbeccbf88269c17f2e7eb265a9cf8fa0b57d..4ad1d0dea5d1b641a8a3a67a6756b6c2d9ba4260 100644 (file)
--- a/docs/4.0/components/alerts.md
+++ b/docs/4.0/components/alerts.md
@@ -73,7 +73,7 @@ You can see this in action with a live demo:
 Enable dismissal of an alert via JavaScript:
 
 {% highlight js %}
-$(".alert").alert()
+$('.alert').alert()
 {% endhighlight %}
 
 Or with `data` attributes on a button **within the alert**, as demonstrated above:

diff --git a/docs/4.0/components/list-group.md b/docs/4.0/components/list-group.md
index 2d5b4f16e0e3683d788ee6001ccfe4e415f71904..0df1ed6371e4f4b6e8b98560dacce1e221c6dfef 100644 (file)
--- a/docs/4.0/components/list-group.md
+++ b/docs/4.0/components/list-group.md
@@ -254,9 +254,9 @@ You can activate individual list item in several ways:
 
 {% highlight js %}
 $('#myList a[href="#profile"]').tab('show') // Select tab by name
-$('#myList a:first').tab('show') // Select first tab
-$('#myList a:last').tab('show') // Select last tab
-$('#myList li:eq(2) a').tab('show') // Select third tab (0-indexed)
+$('#myList a:first-child').tab('show') // Select first tab
+$('#myList a:last-child').tab('show') // Select last tab
+$('#myList a:nth-child(3)').tab('show') // Select third tab
 {% endhighlight %}
 
 ### Fade effect
@@ -295,7 +295,7 @@ Activates a list item element and content container. Tab should have either a `d
 
 <script>
   $(function () {
-    $('#myList a:last').tab('show')
+    $('#myList a:last-child').tab('show')
   })
 </script>
 {% endhighlight %}

diff --git a/docs/4.0/components/navs.md b/docs/4.0/components/navs.md
index 1a22b3bcff621c4884ba31ce252ab26e3a1fbddf..cdba094aa90a69045aa9105254c2cd30588750fa 100644 (file)
--- a/docs/4.0/components/navs.md
+++ b/docs/4.0/components/navs.md
@@ -522,9 +522,9 @@ You can activate individual tabs in several ways:
 
 {% highlight js %}
 $('#myTab a[href="#profile"]').tab('show') // Select tab by name
-$('#myTab a:first').tab('show') // Select first tab
-$('#myTab a:last').tab('show') // Select last tab
-$('#myTab li:eq(2) a').tab('show') // Select third tab (0-indexed)
+$('#myTab li:first-child a').tab('show') // Select first tab
+$('#myTab li:last-child a').tab('show') // Select last tab
+$('#myTab li:nth-child(3) a').tab('show') // Select third tab
 {% endhighlight %}
 
 ### Fade effect
@@ -574,7 +574,7 @@ Activates a tab element and content container. Tab should have either a `data-ta
 
 <script>
   $(function () {
-    $('#myTab a:last').tab('show')
+    $('#myTab li:last-child a').tab('show')
   })
 </script>
 {% endhighlight %}

diff --git a/js/tests/unit/carousel.js b/js/tests/unit/carousel.js
index 521b24ca45a54b0cc754cdd7b757c5369b2bbff2..48752cb917fdeb03cfb10fb32a50f9d3f85bd56e 100644 (file)
--- a/js/tests/unit/carousel.js
+++ b/js/tests/unit/carousel.js
@@ -120,17 +120,17 @@ $(function () {
       .one('slide.bs.carousel', function (e) {
         e.preventDefault()
         setTimeout(function () {
-          assert.ok($carousel.find('.carousel-item:eq(0)').is('.active'), 'first item still active')
-          assert.ok($carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active')
+          assert.ok($carousel.find('.carousel-item:nth-child(1)').is('.active'), 'first item still active')
+          assert.ok($carousel.find('.carousel-indicators li:nth-child(1)').is('.active'), 'first indicator still active')
           $carousel.bootstrapCarousel('next')
         }, 0)
       })
       .one('slid.bs.carousel', function () {
         setTimeout(function () {
-          assert.ok(!$carousel.find('.carousel-item:eq(0)').is('.active'), 'first item still active')
-          assert.ok(!$carousel.find('.carousel-indicators li:eq(0)').is('.active'), 'first indicator still active')
-          assert.ok($carousel.find('.carousel-item:eq(1)').is('.active'), 'second item active')
-          assert.ok($carousel.find('.carousel-indicators li:eq(1)').is('.active'), 'second indicator active')
+          assert.ok(!$carousel.find('.carousel-item:nth-child(1)').is('.active'), 'first item still active')
+          assert.ok(!$carousel.find('.carousel-indicators li:nth-child(1)').is('.active'), 'first indicator still active')
+          assert.ok($carousel.find('.carousel-item:nth-child(2)').is('.active'), 'second item active')
+          assert.ok($carousel.find('.carousel-indicators li:nth-child(2)').is('.active'), 'second indicator active')
           done()
         }, 0)
       })

diff --git a/js/tests/unit/tab.js b/js/tests/unit/tab.js
index 73ebbd6605f946c88f85f7636a711edf18226dd4..c26f07600930295744be417bc12032e37ea3e8d9 100644 (file)
--- a/js/tests/unit/tab.js
+++ b/js/tests/unit/tab.js
@@ -53,10 +53,10 @@ $(function () {
 
     $('<ul><li id="home"/><li id="profile"/></ul>').appendTo('#qunit-fixture')
 
-    $(tabsHTML).find('li:last a').bootstrapTab('show')
+    $(tabsHTML).find('li:last-child a').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'profile')
 
-    $(tabsHTML).find('li:first a').bootstrapTab('show')
+    $(tabsHTML).find('li:first-child a').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'home')
   })
 
@@ -69,10 +69,10 @@ $(function () {
 
     $('<ul><li id="home"/><li id="profile"/></ul>').appendTo('#qunit-fixture')
 
-    $(pillsHTML).find('li:last a').bootstrapTab('show')
+    $(pillsHTML).find('li:last-child a').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'profile')
 
-    $(pillsHTML).find('li:first a').bootstrapTab('show')
+    $(pillsHTML).find('li:first-child a').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'home')
   })
 
@@ -85,10 +85,10 @@ $(function () {
 
     $('<ol><li id="home"/><li id="profile"/></ol>').appendTo('#qunit-fixture')
 
-    $(pillsHTML).find('li:last a').bootstrapTab('show')
+    $(pillsHTML).find('li:last-child a').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'profile')
 
-    $(pillsHTML).find('li:first a').bootstrapTab('show')
+    $(pillsHTML).find('li:first-child a').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'home')
   })
 
@@ -101,10 +101,10 @@ $(function () {
 
     $('<nav><div id="home"></div><div id="profile"></div></nav>').appendTo('#qunit-fixture')
 
-    $(tabsHTML).find('a:last').bootstrapTab('show')
+    $(tabsHTML).find('a:last-child').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'profile')
 
-    $(tabsHTML).find('a:first').bootstrapTab('show')
+    $(tabsHTML).find('a:first-child').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'home')
   })
 
@@ -117,10 +117,10 @@ $(function () {
 
     $('<nav><div id="home"></div><div id="profile"></div></nav>').appendTo('#qunit-fixture')
 
-    $(tabsHTML).find('a:last').bootstrapTab('show')
+    $(tabsHTML).find('a:last-child').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'profile')
 
-    $(tabsHTML).find('a:first').bootstrapTab('show')
+    $(tabsHTML).find('a:first-child').bootstrapTab('show')
     assert.strictEqual($('#qunit-fixture').find('.active').attr('id'), 'home')
   })
 
@@ -193,10 +193,10 @@ $(function () {
         + '</ul>'
 
     $(dropHTML)
-      .find('ul > li:first a')
+      .find('ul > li:first-child a')
         .bootstrapTab('show')
       .end()
-      .find('ul > li:last a')
+      .find('ul > li:last-child a')
         .on('show.bs.tab', function (e) {
           assert.strictEqual(e.relatedTarget.hash, '#1-1', 'references correct element as relatedTarget')
         })
@@ -217,24 +217,24 @@ $(function () {
         + '</ul>'
 
     $(tabsHTML)
-      .find('li:first a')
+      .find('li:first-child a')
         .on('hide.bs.tab', function () {
           assert.ok(true, 'hide event fired')
         })
         .bootstrapTab('show')
       .end()
-      .find('li:last a')
+      .find('li:last-child a')
         .bootstrapTab('show')
 
     $(tabsHTML)
-      .find('li:first a')
+      .find('li:first-child a')
         .on('hidden.bs.tab', function () {
           assert.ok(true, 'hidden event fired')
           done()
         })
         .bootstrapTab('show')
       .end()
-      .find('li:last a')
+      .find('li:last-child a')
         .bootstrapTab('show')
   })
 
@@ -248,7 +248,7 @@ $(function () {
         + '</ul>'
 
     $(tabsHTML)
-      .find('li:first a')
+      .find('li:first-child a')
         .on('hide.bs.tab', function (e) {
           e.preventDefault()
           assert.ok(true, 'hide event fired')
@@ -259,7 +259,7 @@ $(function () {
         })
         .bootstrapTab('show')
       .end()
-      .find('li:last a')
+      .find('li:last-child a')
         .bootstrapTab('show')
   })
 
@@ -273,7 +273,7 @@ $(function () {
         + '</ul>'
 
     $(tabsHTML)
-      .find('li:first a')
+      .find('li:first-child a')
         .on('hide.bs.tab', function (e) {
           assert.strictEqual(e.relatedTarget.hash, '#profile', 'references correct element as relatedTarget')
         })
@@ -283,7 +283,7 @@ $(function () {
         })
         .bootstrapTab('show')
       .end()
-      .find('li:last a')
+      .find('li:last-child a')
         .bootstrapTab('show')
   })
 
@@ -295,19 +295,19 @@ $(function () {
         + '</ul>'
     var $tabs = $(tabsHTML).appendTo('#qunit-fixture')
 
-    $tabs.find('li:first a').bootstrapTab('show')
+    $tabs.find('li:first-child a').bootstrapTab('show')
     assert.strictEqual($tabs.find('.active').attr('aria-selected'), 'true', 'shown tab has aria-selected = true')
     assert.strictEqual($tabs.find('a:not(.active)').attr('aria-selected'), 'false', 'hidden tab has aria-selected = false')
 
-    $tabs.find('li:last a').trigger('click')
+    $tabs.find('li:last-child a').trigger('click')
     assert.strictEqual($tabs.find('.active').attr('aria-selected'), 'true', 'after click, shown tab has aria-selected = true')
     assert.strictEqual($tabs.find('a:not(.active)').attr('aria-selected'), 'false', 'after click, hidden tab has aria-selected = false')
 
-    $tabs.find('li:first a').bootstrapTab('show')
+    $tabs.find('li:first-child a').bootstrapTab('show')
     assert.strictEqual($tabs.find('.active').attr('aria-selected'), 'true', 'shown tab has aria-selected = true')
     assert.strictEqual($tabs.find('a:not(.active)').attr('aria-selected'), 'false', 'hidden tab has aria-selected = false')
 
-    $tabs.find('li:first a').trigger('click')
+    $tabs.find('li:first-child a').trigger('click')
     assert.strictEqual($tabs.find('.active').attr('aria-selected'), 'true', 'after second show event, shown tab still has aria-selected = true')
     assert.strictEqual($tabs.find('a:not(.active)').attr('aria-selected'), 'false', 'after second show event, hidden tab has aria-selected = false')
   })
@@ -320,9 +320,9 @@ $(function () {
         + '</ul>'
     var $tabs = $(tabsHTML).appendTo('#qunit-fixture')
 
-    $tabs.find('li:last a').trigger('click')
-    assert.notOk($tabs.find('li:first a').hasClass('active'))
-    assert.ok($tabs.find('li:last a').hasClass('active'))
+    $tabs.find('li:last-child a').trigger('click')
+    assert.notOk($tabs.find('li:first-child a').hasClass('active'))
+    assert.ok($tabs.find('li:last-child a').hasClass('active'))
   })
 
   QUnit.test('selected tab should deactivate previous selected link in dropdown', function (assert) {
@@ -339,10 +339,10 @@ $(function () {
         + '</ul>'
     var $tabs = $(tabsHTML).appendTo('#qunit-fixture')
 
-    $tabs.find('li:first > a').trigger('click')
-    assert.ok($tabs.find('li:first a').hasClass('active'))
-    assert.notOk($tabs.find('li:last > a').hasClass('active'))
-    assert.notOk($tabs.find('li:last > .dropdown-menu > a:first').hasClass('active'))
+    $tabs.find('li:first-child a').trigger('click')
+    assert.ok($tabs.find('li:first-child a').hasClass('active'))
+    assert.notOk($tabs.find('li:last-child a').hasClass('active'))
+    assert.notOk($tabs.find('li:last-child .dropdown-menu a:first-child').hasClass('active'))
   })
 
   QUnit.test('Nested tabs', function (assert) {