質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

3回答

13989閲覧

jQueryで特定文字以降の文字を取得

ninjanin

総合スコア26

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

1クリップ

投稿2018/10/01 18:12

編集2022/01/12 10:55

<img src="http://example.com/wp-content/imges/test.jpg" alt="">

の中から

wp-content/以降の全ての部分(imges/test.jpg)」

をjQuryで取得するにはどう書けばいいでしょうか?

流れとしては下記の➂を知りたいです。

jquery

1// ➀URLを取得 2var src = $('img').attr('src'); 3 4// ➁「wp-content/」以降の全てを取得 5vat result = ??? 6 7// ➂出力 8alert(result);

ただし事情がありまして、

splitして何番目

などの指定ではなく

「wp-content/」以降の全て

という指定方法を探しています。


下記で大丈夫でしょうか?もっとちゃんとした書き方がないかと不安です。

jQuery

1// ➀URLを取得 2var src = $('img').attr('src'); 3 4// ➁「wp-content/」以降の全てを取得 5 if(src.indexOf("wp-content/")>=0){ 6  var result = src.substring(src.indexOf("wp-content/")+11,src.length); 7 } 8 9// ➂出力 10alert(result);

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

_lemon2003_

2018/10/01 22:29 編集

私の環境では問題はありませんでしたが?気になるとすれば、11と固定値で指定しているぐらいですが、"wp-content/"の部分を変えないのであれば問題はないと思います。 一応、正規表現などほかの方法でも取得できるのはできますが。
m.ts10806

2018/10/02 02:25

_lemon2003_さん 質問内容で要件を汲み取りにくいのかもしれませんが「自分ではこのやり方でひとまずできたけど、もっと簡単に、効果的効率的な書き方はないか?」というのを探られているのかと。なので、「ほかの方法」を回答として書いてあげてください
guest

回答3

0

こんな感じとか
src.substr(str.indexOf('wp-content/') + 'wp-content/'.length);

こうとか
src.replace(/.*wp-content//, '');

やりようはいろいろあるのでどれが正しいとかは特にないです。
.replace()の正規表現の書き方もいろいろあるので人によって違います。
やりたいことが実現できているのならやり方はどうだっていいと思いますよ。
チームで規約とか決まってない限りは。
そういうところにプログラマ個人のクセってやつが出てきたりします。


以下余談です。
上記とは別で気になった点をひとつ。

js

1var src = $('img').attr('src'); 2 3if(src.indexOf("wp-content/")>=0) { 4 // ここで変数宣言 + 代入して 5 var result = src.substring(src.indexOf("wp-content/")+11,src.length); 6} 7 8// ここで使っている 9alert(result);

JavaScriptのvarによる変数宣言にブロックスコープはないので間違ってはいないんですが...
あまり良い書き方とは言えません。
混乱やバグのもとになったりします。

js

1var src = $('img').attr('src'); 2var result; // ここで変数の宣言だけする 3// または、以下のように空文字で初期化して、文字列が代入されることを明示する 4// var result = ''; 5 6if(src.indexOf("wp-content/")>=0) { 7 // ブロック内では代入だけ 8 result = src.substring(src.indexOf("wp-content/")+11,src.length); 9} 10 11// ここで参照 12alert(result);

この方が良いです。
繰り返しになりますが、JavaScriptのvar宣言にはブロックスコープはないので、どちらで書こうと挙動はまったく変わりません。
初期化した場合は、ifブロック内に入らなかったときのresultの値が違いますが。

さらにいうと、変数定義にはconstletが使えます。
letに関しては未実装のブラウザがありますが、constはIE11を含めモダンブラウザすべてで使用できます。
constletにはブロックスコープがあるので、使える限りこちらを使った方がいいかもしれません。

MDN - const :再代入不可
MDN - let :再代入可

投稿2018/10/02 00:42

spookybird

総合スコア1803

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

javascript

1<script> 2$(function(){ 3 var src = $('img').attr('src'); 4 var result = src.match(/wp-content/(.+$)/)[1]; 5 console.log(result); 6}); 7</script> 8<img src="http://example.com/wp-content/imges/test.jpg" alt="">

投稿2018/10/02 01:10

yambejp

総合スコア114585

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

「ちゃんとした書き方」というと意見が分かれそうですが、
まず 11 というぱっと見で意味が分かりにくいマジックナンバーを利用するのは嫌われるので、"wp-content/".length で置き換えたほうが良いかもしれません。

そのほか、シンプルに書き換えるなら、以下の answer 関数のように正規表現を使う方法が考えられます。

javascript

1function answer(url){ return url.replace(/.*?wp-content//, ''); } 2 3console.log(answer("http://example.com/wp-content/imges/test.jpg")); 4 // => imges/test.jpg 5console.log(answer("http://example.com/wp-content/wp-content/imges/test.jpg")); 6 // => wp-content/imges/test.jpg

正規表現の /.*?wp-content// に最初にマッチした部分を空文字 '' に置き換えています。
この正規表現は、 「任意の文字列+'wp-content/' 」にマッチするパターンです。

jQuery は関係のない回答になってしまいましたが……

投稿2018/10/02 00:18

R.Mizukami

総合スコア1077

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問