Q&A
jQueryについての知識はどの程度あるのでしょうか。
- 一旦 $(".para").text() により文章を取得後に元要素は削除
- 200文字毎に新たなp要素を構築して追加
とすればいけそうな気がしますが、コーディングイメージは湧きますでしょうか。
前提・実現したいこと
添付画像のように文字数によってjQueryでブロック分けをすることは可能でしょうか。
（例：５００文字のブロックがあるとして、２００文字目にHTMLタグを挿入しブロック分けする）
jQueryでは無理、またはそれ以外の実装方法があるのであればそれについてもご教授いただければ幸いです。
検索しても同じような事例がなく、どうすればいいか全くわからない状態です。
素人質問で申し訳ありませんが、ご教授ください。
該当のソースコード
HTML
1<p class="para">ここにテキストここにテキストここにテキストここにテキストここにテキストここにテキストここにテキストここにテキストここにテキストここにテキストここにテキストここにテキスト</p>
このpタグの中で、任意の文字数の位置に新たにｐタグを挿入し、ブロック分けできるようにしたいです。
補足情報
今後CMSでテキストの更新をすると考慮したとき、
同様のレイアウトになるようにしたい。といった背景があります。
なので、予めHTMLでブロック分けするといったこと以外で実装したいです。
回答2件
0
ベストアンサー
ご希望とはちょっと違うかも知れませんが、CSS の段組み(Columns)でどうでしょうか。
段組みの基本概念 - CSS: カスケーディングスタイルシート | MDN
css
1.para { 2 width: 600px; 3 height: 150px; 4 border: 1px solid; 5 columns: 2; 6 column-rule: 1px solid; 7 column-fill: auto; 8 column-gap: 1.5em; 9 padding: 1em; 10}
投稿2020/12/14 08:01
編集2020/12/14 08:02
総合スコア34073
この方法で解決できました！
ありがとうございます。
こういったcssプロパティがあることを知らずjQueryが必要と思いこんでおりました。
他のご回答をくださった皆様もありがとうございました！
0
できないことは無いですが、変なところできれてしまうことを考えると
予め提供側が仕様に見合った単位で段落を分けておくべきです
投稿2020/12/14 07:51
総合スコア116661
あなたの回答
tips
プレビュー
