- ベストアンサー
「～」の前後に改行を入れたい
ページの中に「～」が会った場合にその前後に改行(<br />)を入れたいです。 javascriptかjqueryでどうにか実現できないでしょうか？
- tamamayan
- お礼率17% (25/145)
- JavaScript
- 回答数5
- ありがとう数5
- みんなの回答 （5）
- 専門家の回答
質問者が選んだベストアンサー
No.4 の補足に対して querySelectorAll('body *') <p id=kara> の内部を全部対象とするなら → querySelectorAll('p#kara, p#kara *') <p id=kara> の内部に<a>とか<span>とか<script>があって、 そちらは対象外にしたいなら → querySelectorAll('p#kara')
その他の回答 (4)
- Ogre7077
- ベストアンサー率65% (170/258)
まじめに処理するなら // HTML5 <script>window.addEventListener('DOMContentLoaded', function(ev){ var A = function(list){return Array.prototype.slice.apply(list)}; A(document.querySelectorAll('body *')).forEach(function(elem){ if (elem.tagName == 'SCRIPT') return; // TODO 対象外の要素をここに指定 A(elem.childNodes).filter(function(node){ return node.nodeName == '#text' && (''+node.nodeValue).indexOf('～') >= 0; }).forEach(function(text){ var p = text.parentNode, s = text.nextSibling; var x = text.data.split('～').map(function(t){return document.createTextNode(t)}); p.replaceChild(x[0], text); for (var i = 1; i < x.length; i++) { p.insertBefore(document.createElement('br'), s); p.insertBefore(document.createTextNode('～'), s); p.insertBefore(document.createElement('br'), s); p.insertBefore(x[i], s); } }); }); }, false)</script>
- eden3616
- ベストアンサー率65% (267/405)
>何故かこれでは動作がしませんでした。 >書き方が間違っていたりしますか？ ん？動作しますが。 IDタグの記述に間違いがないですか？ IE10、chrome36.0、Firefox31.0で確認 A～B～C A ～ B ～ C ■サンプル <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>test</title> <script type="text/javascript"> <!-- window.onload = function() { document.getElementById('kara').innerHTML = document.getElementById('kara').innerHTML.replace(/～/g, "<br \/>～<br \/>") } --> </script> </head> <body> <p>A～B～C</p> <p id="kara">A～B～C</p> </body> </html>
補足
ありがとうございます。 試してみたのですが、PHPが入るとダメになってしまうようです。 ・bodyで指定すればうまく改行していた。 ・getElementById('kara')に変更すると効かなくなる。 ・<p id="kara">A～B～C</p>であれば改行される。 こういった場合でも動作させるのは可能なのでしょうか。読み込む前にjavascriptが処理をしてしまったりなんてありますか？ <p class="middle" id="kara"> <? if($cal == 1){ ?> A～B～C <? } else if($cal == 2){ ?> A～B～C <? } else if($cal == 3){ ?> A～B～C <? } else if($cal == 4){ ?> A～B～C <? } else if($cal == 5){ ?> A～B～C <? } else if($cal == 6){ ?> A～B～C <? } else { ?> A～B～C <? } ?> </p> <!--{/each}--> <script type="text/javascript"> <!-- window.onload = function() { document.getElementById('kara').innerHTML = document.getElementById('kara').innerHTML.replace(/～/g, "<br \/>～<br \/>") } --> </script>
- yambejp
- ベストアンサー率51% (3827/7415)
タグ内にあった場合どうするつもりでしょうか？ <img src="hoge.jpg" alt="A～B" width=100 height=100> ↓ <img src="hoge.jpg" alt="A<br />～<br />B" width=100 height=100> でいいの？
補足
今確認したところ、 一つ目の～は上手く改行が入っていたのですが、2個め以降の～が改行されていませんでした。 二回目以降も入れるにはどう記述すればよいでしょうか。
- eden3616
- ベストアンサー率65% (267/405)
ページ読込後に「～」を「<br />～<br />」に置換しています。 A～B～C が以下のようになります。 A ～ B ～ C ■サンプル <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <title>test</title> <script type="text/javascript"> <!-- window.onload = function() { document.body.innerHTML = document.body.innerHTML.replace(/～/g, "<br \/>～<br \/>") } --> </script> </head> <body> A～B～C </body> </html>
補足
ありがとうございます。 思ったように動作しました。 ただページ内の他にも～が入ってしまったようでそこでも改行が発生してしまいました。 急遽変更したい場所にid=karaを割り振ってその場所のみ改行を入れるようにしたのですが、 window.onload = function() { document.getElementById('kara').innerHTML = document.getElementById('kara').innerHTML.replace(/～/g, "<br \/>～<br \/>") } 何故かこれでは動作がしませんでした。 書き方が間違っていたりしますか？
関連するQ&A
- divやp要素の前後は改行されるとありますがどこから改行されるのでしょうか
<body> <div align="center"> <br> あいうえお<br> <img src="../xxx/1.jpg" width="640" height="400" border="0"> <br> <p class="text_min"> あいうえお<br> </p> あいうえお<br> <br> </div> </body> 上記の場合、改行位置はこうでしょうか？↓ ＊改行＊ <div align="center"> </div> *改行* ＊改行＊ <p class="text_min"> </p> ＊改行＊ という事でしょうか？ 当たり前のような質問ですいません！
- 締切済み
- HTML
- せっかく入れた改行コードが消えてしまう
質問:No.7994841は一旦、ベストアンサーにした方から頂いた回答のやり方で解決できたので質問を閉じて、改めてその質問に関係する新たな質問を立たせて頂きました。 改めて状況を書かせて頂きますと、 ショッピングサイトを運営・管理しています。 ＣＧＩを使ったネットショップ、及び管理サイトがあるのですが、管理サイトからデータを登録すると一旦phpMyadminのデータベース上にデータが登録されて、ネットショップのページにてその登録したデータが表示される仕組みになっています。 そして、前の質問では、 「そのネットショップで見れる所では改行等入れながら成形されたデータを表示したいのですが、管理サイトから改行を<br>で登録するとデータベースでは、<br>と登録されて、実際のネットショップでは<br>と改行コードそのまま表示されて改行されていません。 データベースを直接いじってデータ内に<br>と入れるとネットショップでも正しく改行がされているのですが、管理サイトを色んな人に使ってもらうことを考えるとデータベースを直接いじりたくないのです。」 という質問をさせて頂き、解決方法を頂いたので解決できました。 そして、改めて質問スレッドを立たせて頂いた新たな質問が２つあります。 (1)上記において頂いた回答は$line =~s /<br>/<br>/g;とprintを使う方法で、そのとき困っていたページではその書き方でテンプレートのhtmlを読み込んで行うやり方だったので解決できました。 もう一つcgiのソースファイル内で直接html文書を書いて表示させるページもあってそちらの場合だと$lineやprintを使わずに表示しているのですがこういったページの表示方法の場合はどのようにしたら上手く行くでしょうか？ (2)前回の質問とはこちらも別のページのことなんですが、こちらの場合は一旦データ編集を行い「確認」ボタンがあって押すと入力したデータ一覧を確認できるページに転移してそのページにある「登録」ボタンを押すことでデータがデータベースに登録されます。 その、編集ページから確認ページに転移した際に改行コード<br>や改行【Enter】が消えてしまって確認ページには改行コード等がなくなってしまっています。 前回の質問のページとの違いですが、 前のページはｈｔｍｌ内でformがあり、そこにaction（自分のｃｇｉにして再読み込み）もmethodも記載されて確認ページの処理が動くモード設定も同じform内で行っていました。 なので、確認ボタンが押されると同じｃｇｉが再度呼ばれて確認ページの処理が行われます。 今回のは、form内にはactionもmethodもなく確認ボタンを押したタイミングでjavascriptが呼ばれてそのjavacriptで引き数を元にactionとmethodを設定して自分のcgiに対してsubmitしていました。 出来ればあまり大きな修正を加えずに対応したいのですが良い解決方法がありましたら教えて頂けますようよろしくお願いします。
- ベストアンサー
- CGI
- 改行は？
掲示板等に書き込みする時に、自分の思い通りに改行して、掲載されるようにしたい場合は、どのようにすればよいのでしょう？ 書き込みして決定して掲載された時に、自分の思い通りの場所で、改行されてないときがあります ＢＲと入力すればよいと聞いたことありますが、ＢＲと入力してもそのままＢＲという文字が掲載されていて、改行していなかったりします 他に何か特別なことが必要なのでしょうか？
- ベストアンサー
- その他（インターネット接続・通信）
- 改行キーの判断
こんにちは教えてください。 あるフォームのテキストエリアに入力された値を他のページに渡す必要があります。 その時、テキストエリアに入力された値に含まれる改行キーも一緒に渡したいのですが、うまく行きません。 strUrl="mypage.php?Memo="+document.frmMypage.txtMemo.value 例えばこんな感じで渡しています。 できれば改行キーを"<br>"に変換して渡したいのですが・・・。 とりあえず、改行キーを判断する方法がJavaScriptにあるのかどうかだけでも教えていただけないでしょうか。 よろしくお願いいたします。 環境はWinNT4.0(SR6) IE5.0 (JavaScriptはIE4.0以上で動くことを予想しています)
- ベストアンサー
- JavaScript
- <br>で改行しても一行あいてしまいます
少し説明がわかりにくいかもしれませんが <br>タグを使って改行した場合、行と行の間はあきませんよね？ でもたまに<br>タグで改行してるのに行と行の間が一行空くことがたまにあります。 その時のタグは <br>文 <br>文２ と打つと 文 文２ 後で見るとこのように反映されます。 同じページで同じ<br>タグを使ってる他の行は改行だけで 行の間が空くことはないのに、何度やっても同じ箇所だけ一行空いてしまいます。 これはどうしてでしょうか？プラウザはIE6.0なんですが そこの部分だけ何度やっても一行空いて見た目が変です。 何か解決策はないでしょうか？
- ベストアンサー
- HTML
- DreamweaverMXの改行について
WindowsXPでDreamweaverMXを使用しています。 Dreamweaver自体の操作が良くわからなくて コードウィンドウに直接タグ書きをしているような 状態です。 ２行、改行をしたい場合に＜br＞＜br＞と入力すると IEでは、なぜか２行分改行されません。 一行だけ改行された状態になっています。 これが、オペラやDreamweaverのデザインビューだと きちんと２行分改行されているのですが・・・。 ＜br＞＜br＞＜br＞＜br＞と入力して ようやくIEで２行分改行されているような状態 です。 何か設定ミスや、間違って操作しているところが あるのでしょうか？ よろしければ、ご指摘下さい。 よろしくお願いします。
- ベストアンサー
- ホームページ作成ソフト
- 変数の中の改行コードをBRタグに置き換えたい
変数の中の改行コードをBRタグに置き換えたいのですが出来ますか？ 前のページから改行コードを含む文字列を受け取っています。どうすればいいか教えてください
- ベストアンサー
- Microsoft ASP
- PCの改行について!!!!
チャットなどで改行する際、 <ＢＲ>を入れますよね。 これが機能しない場合はあるのでしょうか。 ＢＲまたはＳＨＩＦＴ+ＥＮＴＥＲで 改行出来ると聞いたのですが、出来ません。 改行したい場所は、チャット場なのですが…。 パソコンの種類等関係有るのでしょうか。 種類はWINDOWS XPです。 なんとか明日までにマスターしたいのです！ よろしくお願い致します!!!!
- 締切済み
- その他([技術者向] コンピューター)
補足
ありがとうございます。 この内容で、<p id=kara>◆</p>の◆部分を対象にする場合はどこを書き換えれば可能ですか？ body *でしょうか