Heim > Web-Frontend > js-Tutorial > Hauptteil

So erzeugen Sie den Effekt des Wechselns der Schriftarten, indem Sie auf den Titeltext klicken

php中世界最好的语言
Freigeben: 2018-06-04 15:36:22
Original
2015 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie den Effekt erzielen, wenn Sie auf den Titeltext klicken, um die Schriftart zu ändern, und welche Vorsichtsmaßnahmen es gibt, wenn Sie auf den Titeltext klicken, um den Schriftarteffekt zu ändern ist ein praktischer Fall, werfen wir einen Blick darauf.

Dies ändert hauptsächlich die Schriftart, indem bestimmt wird, ob das untergeordnete Element des angeklickten Elements ein b-Element enthält. Die Funktion „wrapInner“ dient dazu, das b-Tag innerhalb des $author-Elements hinzuzufügen.

Das Zurückschalten auf die normale Schriftart erfolgt durch die Umwandlung des Inhalts in Klartext und das anschließende Ersetzen des Elementinhalts.

Der Kerncode lautet wie folgt:

$('#f-author').css('cursor','pointer');
$('#f-author').click(function(event){
  var $author = $(this);
  if(!$author.children().is('b')){//子元素没有b
    $author.wrapInner('<b></b>');//包含在$author里面
  }
  else{
    var text = $author.text(); //纯文本
    $author.text(text);
  }
});
Nach dem Login kopieren
Der vollständige Code lautet wie folgt:





www.jb51.net jQuery点击标题切换字体



这里显示测试标题文字

<script> $('#f-author').css('cursor','pointer'); $('#f-author').click(function(event){   var $author = $(this);   if(!$author.children().is('b')){//子元素没有b     $author.wrapInner('&lt;b&gt;&lt;/b&gt;');//包含在$author里面   }   else{     var text = $author.text(); //纯文本     $author.text(text);   } }); </script>
Nach dem Login kopieren
Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

So lösen Sie das Problem der Konfiguration des Verpackungsdateipfads

Wie man CSS-Dateien mit betreibt r.js

Das obige ist der detaillierte Inhalt vonSo erzeugen Sie den Effekt des Wechselns der Schriftarten, indem Sie auf den Titeltext klicken. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!