rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-01 13:24:25 +01:00
Code Issues Actions Packages Releases Activity

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

Browse Source
This commit is contained in:
Vasilii Artemchuk 2017-11-09 08:51:19 +03:00 committed by XhmikosR
parent 75bdc6d962
commit 5a2d6c70f4
5 changed files with 46 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
docs/4.0/components/alerts.md
View File

@ -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:

8
docs/4.0/components/list-group.md
View File

@ -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 %}

8
docs/4.0/components/navs.md
View File

@ -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 %}

12
js/tests/unit/carousel.js
View File

@ -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)
})

62
js/tests/unit/tab.js
View File

@ -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) {