Hide element if data contains specific text
Place to talk about website HTM elements, CSS style and design, and get help with HTML, CSS codes.
-
Marius
- Posts: 107
Hide element if data contains specific text
Is there a possibility to hide HTML elements if the 'data-' attribute contains a specific piece of text?
For example: Hide the Divs that it's data contains "-en".
Code: Select all
<div class='check' data-value='example-en'></div>
<div class='check' data-value='check-en'></div>
<div class='check' data-value='example2-en'></div>
<div class='check' data-value='check-fr'></div>
Thanks!
MarPlo
You can do this with either CSS or Javascript.
CSS:
Code: Select all
/* with specified elements */
div[data-value*='-en'] {
display: none;
}
/* or global */
[data-value*='-en'] {
display: none;
}
And if you wanted to do it based on data in classes name.
And JS:
Code: Select all
document.querySelectorAll('[data-value*="-en"]').forEach((elem) => elem.style.display ='none');
Similar Topics
-
Toggle Show Hide-0Javascript
PHP - MySQL
First post
Hello CoursesWeb,
I have sql document with 4 results from-out database.
But I can`t open the results from the post_id ????
What do I do wrong...
Last post
Try the following code. See the differences.
<?php
echo '<div id= idd11'. $row .' style= display:none; >';
echo $row ;
echo...
-
How to get text from javascript alert box
JavaScript - jQuery - Ajax
First post
Good evening (dutch-time) I have a javascript what can copy text to a clip-board + it has a button to show the item-list in a alert-box.
But can`t...
Last post
Thanks for the support I tried already things with history + f_print
also studied those a little before I asked coursesweb but I shall
when my head...
-
Link inline with the text
HTML - CSS
First post
Hi members I'm looking for the script for a link <href> to another URL.
I give part of my text and the link as it is now on my page:
and...
Last post
Hello,
In your case, put both the text and the link inside the <p> tag.
<p>and there where useful, supplemented with comments, tips...
-
Javascript add different text to each minute of hour
JavaScript - jQuery - Ajax
First post
Hello Coursesweb I`m unknown with javascripts ????
I would like to add function minutes to this script
on each minute an diferent text added to...
Last post
Hello,
Try the following script.
<div id='addtxtmin' style='color:#00d; font-size:20px; font-weight:700'></div>
<script>
const...
-
Reverse the characters added in text field
JavaScript - jQuery - Ajax
First post
I have the following html and JavaScript code. An input text box and a button.
<input type='text' id='backwards-input'>
<button...
Last post
Try use and study the following code:
<input type='text' id='backwards-input'>
<button id='backwards-button'>Button</button>...