Pracuję nad witryną za pośrednictwem WordPressa iz jakiegoś powodu mogę edytować CSS, ale nie kod HTML, i chcę ukryć część tekstu, ale nie cały. Kod to:

Chcę ukryć „CATEGORY:”

<div class="page-heading">
  <div class="page-title">
     <h2>Category: Vegetables</h2>
  </div>
</div>
0
Vishal Zala 2 kwiecień 2020, 15:49

3 odpowiedzi

Najlepsza odpowiedź

Ponieważ nie możesz dodać tagu span do kodu HTML i dlatego nie możesz oddzielić „Category:” od reszty tekstu, aby zaadresować go za pomocą CSS, możesz użyć Javascript / jQuery:

Możesz użyć następującego skryptu. Usuwa element „Kategoria:” z tekstu, zastępując go niczym, i zostanie zastosowany do dowolnego h2 w elemencie .page-title, który znajduje się wewnątrz elementu .page-heading .

var myheader = $('.page-heading .page-title h2').text();
var changedtext = myheader.replace("Category: ", "");
$('.page-heading .page-title h2').text(changedtext);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="page-heading">
  <div class="page-title">
    <h2>Category: Vegetables</h2>
  </div>
</div>
-1
Johannes 2 kwiecień 2020, 13:10

Użyłem tego cdn https://cdnjs.cloudflare.com /ajax/libs/jquery/2.1.3/jquery.min.js

https://codepen.io/stanley3569/pen/qBdwpQq

<h2>Category: Vegetables</h2>

Css

.hiddenText {
  opacity: 0;  
}

Js

$("h2").html(function(){
  var text= $(this).text().trim().split(" ");
  var first = text.shift();
  return (text.length > 0 ? "<span class='hiddenText'>"+ first + "</span> " : first) + text.join(" ");
});
-1
Stanley Fernandes 2 kwiecień 2020, 13:12
<style>
#cat_hide     {
display: none;
 }
 </style>
</head>
<body>
<!-- Note : You want hide any content  you must lock that 
content with any possible tag.  -->
 <div class="page-title">
<h2><span Id="cat_hide">Category:</span> 
  Vegetables</h2>
</div>
</body>
-1
matthias_h 2 kwiecień 2020, 13:16