ホームページ >ウェブフロントエンド >jsチュートリアル >jQueryテキストをHTMLリストに変換 - $ .StringTolist

jQueryテキストをHTMLリストに変換 - $ .StringTolist

Joseph Gordon-Levitt
Joseph Gordon-Levittオリジナル
2025-03-05 00:15:08959ブラウズ

このjQueryユーティリティは、テキストをHTMLリスト(注文または順序付け)に変換します。 それは、文の終わりの期間を区切り文字として使用します。

前:

jQuery Convert Text to HTML List - $.stringToList

後:

jQuery Convert Text to HTML List - $.stringToList

jquery.stringtolist()(元のバージョン):

/*
 * $.stringToList
 * jQuery Function to convert a block of text into a HTML list.
 * Requires: Full stops after each sentence to delimit list items.
 * @param: listType: 'ul' or 'ol'
 * Usage: $('#inclusions').stringToList('ul');
 * Author: Sam Deering
 */
$.fn.extend({
    stringToList: function(listType) {
        var sentenceRegex = /[a-z0-9,'‘- ]+/igm, htmlList = '<' + listType + '>';
        $.each($(this).html().match(sentenceRegex), function(i, v) {
            if (v && /[a-z0-9]+/igm.test(v) && v != 'strong') {
                htmlList += '
  • ' + v + '
  • '; } }); htmlList += ''; $(this).html(htmlList); } }); // Convert text to HTML list $('#inclusions').stringToList('ul');

    jquery.stringtolist()(namespaced version):

    /*
     * NAMESPACE.stringToList - jQuery Function to convert a block of text into a HTML list.
     * Requires: Full stops after each sentence to delimit list items.
     * @param: textContainer (jQuery object), listType: 'ul' or 'ol'
     * Usage: NAMESPACE.stringToList($('#inclusions'),'ul');
     */
    NAMESPACE.stringToList = function(textContainer, listType) {
        var sentenceRegex = /[a-z0-9,'‘- ]+/igm, htmlList = '<' + listType + '>';
        $.each(textContainer.html().match(sentenceRegex), function(i, v) {
            if (v && /[a-z0-9]+/igm.test(v) && v != 'strong') {
                htmlList += '
  • ' + v + '
  • '; } }); htmlList += ''; textContainer.html(htmlList); }; // Convert text to HTML list NAMESPACE.stringToList($('#inclusions'), 'ul');

    $.parseHTML()を使用して、jquery文字列に関するHTML変換に関するよくある質問(FAQ) このセクションでは、jQueryの

    メソッドを使用して、文字列をHTMLに変換することに関する一般的な質問に対処します。これは、元のコードとは異なるアプローチです。 元のコードは、コンテナ要素のHTMLを直接操作します。

    はより多くのコントロールを提供し、潜在的に奇形のHTMLを処理するためのより安全です。 $.parseHTML() jqueryの$.parseHTML()

    で文字列をHTML要素に変換する方法

    $.parseHTML()を使用して、文字列をdomノードに解析し、domに追加します。

    $.parseHTML()

    vs.
    var str = "<div>Hello World!</div>";
    var html = $.parseHTML(str);
    $("body").append(html);

    $.parseHTML()jQuery()domノードの配列を返します。

    文字列を受け入れることができますが、それを異なって処理します(既存のjQueryオブジェクトに追加)。

    は、特にHTML文字列を解析するためのものです 文字列を複数のHTML要素に変換する$.parseHTML()jQuery() $.parseHTML()

    文字列内の複数の要素を処理し、ノードの配列を返します。

    変換されたHTMLをDOM

    に追加します

    $.parseHTML()

    、または

    を使用して、解析された要素をDOMに追加します。

    append()を使用したエラーの処理 prepend()insertBefore()明示的なエラー処理はありません。 形成されていない文字列は、空の配列につながる可能性があります。 堅牢なエラー処理には、追加のチェックが必要です。insertAfter()

    $.parseHTML()でスクリプトを実行します 解析されたhtml内の

    スクリプトは、

    not$.parseHTML()デフォルトで実行されません。 これはセキュリティ機能です。

    jQueryバージョン互換性$.parseHTML()

    は、jquery 1.9以降で利用できます。 xmlまたはsvgを解析します

    はHTML専用です。 xml。

    を使用します $.parseHTML()文字列をHTMLリストまたはテーブルに解析します

    で文字列を解析し、結果のDOMノードを操作して、jQueryメソッドを使用してリストまたはテーブルに構成します。

    この改訂された回答は、$.parseHTML()を使用して、元のコードと一般的なjQueryアプローチの両方のより包括的かつ正確な説明を提供します。 ニーズとコンテキストに最適な方法を選択することを忘れないでください。 シンプルなリスト作成の場合、元のstringToList関数で十分です。より複雑なHTML操作の場合、または潜在的に安全でないHTML入力を扱う場合、$.parseHTML()はより安全で堅牢なオプションです。

    以上がjQueryテキストをHTMLリストに変換 - $ .StringTolistの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

    声明:
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。