Menu
I am using bootstrap, (Ok, I am new to it), I found this two attributes, can somebody explain it to me?
212
For <base> elements, the target attribute specifies the default target for all hyperlinks and forms in the page. For <form> elements, the target attribute specifies a name or a keyword that indicates where to display the response that is received after submitting the form.
data-slide accepts the keywords prev or next , which alters the slide position relative to its current position. Alternatively, use data-slide-to to pass a raw slide index to the carousel data-slide-to="2" , which shifts the slide position to a particular index beginning with 0 . Read more about HTML5 data- attributes.
data-target is used by bootstrap to make your life easier. You (mostly) do not need to write a single line of Javascript to use their pre-made JavaScript components. The data-target attribute should contain a CSS selector that points to the HTML Element that will be changed.
Just add data-toggle="collapse" and a data-target to element to automatically assign control of a collapsible element. The data-target attribute accepts a CSS selector to apply the collapse to. Be sure to add the class collapse to the collapsible element. If you'd like it to default open, add the additional class in.
Just to carry forward the point of @Larsenal, custom data attributes could be very handy for developers. Like the spec says:
Custom data attributes are intended to store custom data private to the page or application, for which there are no more appropriate attributes or elements. These attributes are not intended for use by software that is independent of the site that uses the attributes.
Example usage includes:
Storing initial height/width, which might later be changed with JS. There are easy ways to get and set these attributes through JavaScript - using getAttribute and setAttribute.
<div id='strawberry-plant' data-fruit='12'></div> <script> // 'Getting' data-attributes using getAttribute var plant = document.getElementById('strawberry-plant'); var fruitCount = plant.getAttribute('data-fruit'); // fruitCount = '12' </script> Remember though, this is not good practice. So, make use of dataset properties.
Read more about data-attributes here: http://html5doctor.com/html5-custom-data-attributes/
You would fall in love with them as a JavaScript developer (or maybe not).
110
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
