Div'in İçerisindeki Bağlantının Yanındaki Metni Nasıl Gizleyebilirim?

25-12-2021, 21:34:44

Aşağıdaki gibi bir html yapısı var, yapıya müdahale edemiyorum. CSS ile bağlantının yanındaki "Görünmeyecek Metin" display: none; ile gizlenmeli ancak nasıl seçebileceğimi bilmiyorum.

<div class="divinclassi"><a href="https://siteadi.com/" title="abc" alt"abc">Bağlantı Metni</a>Görünmeyecek Metin</div>

div'e display:none; verip bağlantıyı hariç tutmak çözüm olacaktır.

25-12-2021, 21:38:16

#2

kozanfirmam

bakalım any

25-12-2021, 21:39:26

#3

hicyilmaz

<p style="display:none;">Görünmeyecek Metin </p>

ya da
<span style="display:none;">Görünmeyecek Metin </span>

25-12-2021, 21:49:27

#4

WebPerformans

hicyilmaz adlı üyeden alıntı: mesajı görüntüle

<p style="display:none;">Görünmeyecek Metin </p>

ya da
<span style="display:none;">Görünmeyecek Metin </span>

Yapıya müdahale edemiyorum yazmış.

25-12-2021, 22:04:10

#5

ahmetkucukonder

En basitinden bu şekilde çözersiniz, eğer diğer metni element içerisine alabilirseniz .divinclassi > :not(a) display none şeklinde daha sağlıklı yapı oluşturabilirsiniz.

.divinclassi{
  font-size:0;
  user-select:none;
}
.divinclassi a{
  font-size:1rem;
  user-select:text;
}

25-12-2021, 22:14:59

#6

WebPerformans

Eğer body tarafına bir kod ekleyebiliyorsan şunuda yapabilirsin;

<script>
document.querySelector(".divinclassi").innerHTML = 'HTML KODU';
</script>

Özel HTML kodu yazabilirsin

25-12-2021, 23:51:02

#7

SkyGhostAir

Site bana ait olmadığı için müdahale edemiyordum. font-size: 0; ile de kopya yapıştır yaparken sorun yaşadım zira silmeye çalıştığım aslında metin değil   şeklinde boşluk koduydu ve her seçtiğimde boşluk kopyalamama sebep oluyordu. opacity ile görünmez bile yapsam seçebileceğim için problem yarattı.

Çözüme ise şu şekilde ulaştım: Tarayıcıda İncele'yi açıp tümünü kapsayan bir element seçip F2 ile düzenlemeyi açtıktan sonra CTRL+A ile tümünü seçip kopyaladım ve metin editöründe bul ve tümünü sil ile   tamamını sildim ve geri yapıştırdım. Uzun bir listede işlem yaptığım için bu benim için yeterli oldu.

@Nokvi; üstte bahsettiğim silme işlemini tarayıcıda   bul ve sil yapabilsem süper olur aslında.

26-12-2021, 05:49:26

#8

ahmetkucukonder

Kopyala yapıştır yaparken görünmeyen metin de seçiliyordu, sonradan fark ettim üstteki CSS kodunu düzenledim.
Eğer sürekli ve birden fazla elemente uyguladığınız bir işlem ise konsol üzerinden komut gönderip istediğiniz biçimde döndürmeniz daha pratik olur.
Class adını kendinize göre düzenleyip çalıştırın, divdeki  'leri silip direkt içeriği döndürecektir. Editörünüzde veya herhangi bir online ortamda beautify işlemini yapabilirsiniz. Tampermonkey kullanarak document ready içerisinde otomatik hale getirebilirsiniz.

let urls = [];
$(".divinclassi").html(function (i, html) {
    return html.replace(/&nbsp;/g, '');
});
$(".divinclassi").each(function() {
urls.push($(this).prop("outerHTML"));
//Eğer element içerisindeki a etiketini ve yazıyı alacaksanız .prop("outerHTML") yerine .html() kullanın.
});
console.log(urls.join(""));

27-12-2021, 08:22:14

#9

SkyGhostAir

ahmetkucukonder adlı üyeden alıntı: mesajı görüntüle

Kopyala yapıştır yaparken görünmeyen metin de seçiliyordu, sonradan fark ettim üstteki CSS kodunu düzenledim.
Eğer sürekli ve birden fazla elemente uyguladığınız bir işlem ise konsol üzerinden komut gönderip istediğiniz biçimde döndürmeniz daha pratik olur.
Class adını kendinize göre düzenleyip çalıştırın, divdeki  'leri silip direkt içeriği döndürecektir. Editörünüzde veya herhangi bir online ortamda beautify işlemini yapabilirsiniz. Tampermonkey kullanarak document ready içerisinde otomatik hale getirebilirsiniz.

let urls = [];
$(".divinclassi").html(function (i, html) {
    return html.replace(/&nbsp;/g, '');
});
$(".divinclassi").each(function() {
urls.push($(this).prop("outerHTML"));
//Eğer element içerisindeki a etiketini ve yazıyı alacaksanız .prop("outerHTML") yerine .html() kullanın.
});
console.log(urls.join(""));

Hocam harikasın. Yazdıklarının yarısını Javascript bilmediğim için anlamadım ama sayende sorunum çözüldü. JS ile kaldırmaktansa güncellenen CSS kodları çok pratik oldu zira ben onları tarayıcı eklentisi ile ilgili url'de çalışsın şeklinde eklemenin yolunu buldum. İlgili eklenti: https://chrome.google.com/webstore/d...jhadmkdbcldfcb