Heim > Artikel > Web-Frontend > So verwenden Sie die Methode html() in jquery

So verwenden Sie die Methode html() in jquery

醉折花枝作酒筹Original: 2021-06-08 14:33:284956Durchsuche

In JavaScript lautet die Verwendung der Methode „html()“ „element.html (neuer Inhalt des ausgewählten Elements)“. Die HTML-Methode legt den Inhalt des ausgewählten Elements fest oder gibt ihn zurück. Wenn diese Methode zum Zurückgeben von Inhalten verwendet wird, wird der Inhalt des ersten übereinstimmenden Elements zurückgegeben. Wenn diese Methode zum Festlegen von Inhalten verwendet wird, wird der Inhalt aller übereinstimmenden Elemente neu geschrieben.

Die Betriebsumgebung dieses Tutorials: Windows 7-System, JavaScript-Version 1.8.5, Dell G3-Computer.

HTML-Inhalt bedeutet, dass der Inhalt HTML-Tags enthalten und vom Browser gerendert werden kann.

Der Textinhalt besteht darin, zunächst die vordefinierten HTML-Zeichen im Inhalt in HTML-Zeicheneinheiten umzuwandeln, sodass die HTML-Tags nicht gerendert werden.
Grammatikstruktur 1:

$(selector).html()

Wenn die Methode zu diesem Zeitpunkt keine Parameter annimmt, erhält sie den HTML-Inhalt des ersten übereinstimmenden Elements.

Diese Methode ähnelt der text()-Methode ohne Parameter, es gibt jedoch immer noch einen großen Unterschied:

Die One.html()-Methode ruft den Inhalt des ersten passenden Elements ab, während die text()-Methode den darin enthaltenen Inhalt erhält in allen passenden Elementen Inhalt.
2. Die Methode html() ruft den HTML-Inhalt ab, während die Methode text() den Textinhalt abruft.

Beispielcode:

<!DOCTYPE html>
<html>
  <head>
    <meta charset=" utf-8" />
    <meta name="author" content="https://www.jb51.net/" />
    <title></title>
    <style type="text/css">
      div{
        height:150px;
        width:150px;
        background-color:green;
        margin-top:10px;
      }
    </style>
    <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
    <script type="text/javascript">
      $(document).ready(function () {
        $("button").click(function () {
          alert($("div").html());
        });
      });
    </script>
  </head>

  <body>
    <div>
      <ul>   
        <li>
          <span>欢迎您</span>
        </li>         
      </ul>
    </div>
    <button>点击查看效果</button>
  </body>
</html>

Der obige Code gibt den Inhalt im div-Element zurück.

Grammatikstruktur 2:

$(selector).html(content)

Mit Parametern wird der HTML-Inhalt aller übereinstimmenden Elemente festgelegt.
Diese Methode ähnelt der text()-Methode mit Parametern, es gibt jedoch immer noch einen großen Unterschied:
html()-Methode legt den HTML-Inhalt fest, während die text()-Methode den Textinhalt festlegt.

Beispielcode:

Der folgende Code setzt den HTML-Inhalt im div auf „a4b561c25d9afb9ac8dc4d70affff419Ich bin der zurückgesetzte Inhalt0d36329ec37a2cc24d42c7229b69747a“.

<!DOCTYPE html>
<html>
  <head>
    <meta charset=" utf-8" />
    <meta name="author" content="https://www.jb51.net/" />
    <title>脚本之家</title>
    <style type="text/css">
      div
      {
        height:150px;
        width:150px;
        background-color:green;
        margin-top:10px;
      }
    </style>
    <script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
    <script type="text/javascript">
      $(document).ready(function () {
        $("button").click(function () {
          $("div").html("<b>我是重新设置后的内容</b>");
        });
      });
    </script>
  </head>
  
  <body>
    <div>原来内容</div>
    <button>点击查看效果</button>
  </body>
</html>

【Empfohlenes Lernen: Javascript-Tutorial für Fortgeschrittene】

Das obige ist der detaillierte Inhalt vonSo verwenden Sie die Methode html() in jquery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

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

Vorheriger Artikel：So steuern Sie Seitensprünge mit JavascriptNächster Artikel：So steuern Sie Seitensprünge mit Javascript

In Verbindung stehende Artikel

Mehr sehen