遅刻の「言い訳」選手権

Bookmarkletに関して

解決済

  • 質問者：tonton-v2
  • 質問日時：
  • 回答数：6件

質問失礼します。
現在JavaScriptを用いてページ上の選択した部分のソースを取得して、あるページに送るというBookmarkletを作成しようとしているのですが、Firefox３上で動作するものが出来ません。

例えば
javascript:(function(){javascript:window.open('http://localhost:3000/webscraps/new?title='+enco …})()
これならIE上で思い通りの動作をするのですが、Firefoxでは動きません。

javascript:(function(){javascript:window.open('http://localhost:3000/webscraps/new?title='+enco …})()
これではFirefox3上で動くのですが、選択範囲ではなくページ全体のソースが送られます。

どなたか分かる方がいらっしゃいましたら、「Firefox3上で選択部分のソースを取得するBookmarklet」を教えて頂けませんか？

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (6件)

No.5ベストアンサー

  • 回答者： taloo
  • 回答日時：

すでに書かれていますが


> javascript:(function(){javascript:
この書き方がNGです。


> ページ上の選択した部分のソースを取得して
とのことですが、

<p>あいうえお<span>かきくけこ</span>さしすせそ</p>

というソースがあったとして、ブラウザ表示上で「えおかきく」の部分が選択された状態の時のソースというのは
「えお<span>かきく」
ということでしょうか？

それはたぶん、すべてのブラウザでできないと思います。

var sel=getSelection();
if(sel!=undefiend && sel.rangeCount>0)
var range=sel.getRagneAt(0);

これで選択範囲が取得できるので、（私はwindow.getSlection()を使っていますが、、、）
https://developer.mozilla.org/en/DOM/range
このあたりを参考にしてみてください。

単純にrange.toString()でいいかもしれませんし、
range.cloneContents()でdocumentFragmentを生成してinnerHTMLなどを何かしないといけないかもしれません。

documentFragmentにはinnerHTMLがないので、<div>を生成してコピーしてみました。

javascript:(function(){sel=getSelection();
if(sel && sel.rangeCount>0){
range=sel.getRangeAt(0);
d=document.createElement('div');d.appendChild(range.cloneContents());
alert(d.innerHTML);}})()

長いので改行しています。


cloneContents()の仕様上、ValidなHTML（XHTML）に書き換えられますので、
選択した範囲のHTMLとは異なりますが、ご参考まで。
    • good
    • 0
    • 件
通報する
この回答へのお礼

教えていただいたコードで思い通りの動作をさせることができました！
しかし、自分の勉強不足も身に染みたのでこれを機にjavascriptの知識をもう少し付けようと思います＾＾；
御回答本当にありがとうございました！

通報する
お礼日時：2008/10/23 01:49

No.6

  • 回答者： taloo
  • 回答日時：

連続失礼します。



> ANo.1お礼
> <a href="​http://www​～">リンク</a>が取得できるといったものです）
もしhref属性だけを取りたいのであれば、
innerHTMLではなくcloneContentsでdocumentFragmentを生成した後、
DOMツリーからaエレメントを探し、getAttribute('href')などで取得した方がいいかもしれません。
    • good
    • 0
    • 件
通報する

No.4

  • 回答者： _pipi_
  • 回答日時：

>javascript:(function(){javascript:window.open('​

http://localhost:3000/webscraps/new?title='+enco …​})()
これってもしかして<a href="javascript:～
で始めてますか？
そしてfunction(){javascript:～て記述があります
これも変！クラス定義みたいになってるし

もしやるなら
<a href="#" onClick="window.open(～
だけでよいのでは？
    • good
    • 0
    • 件
通報する
この回答へのお礼

javascriptの記述を全く理解できていないのにやろうとしていたもので＾＾；
これから知識を付けていこうかと思います
御回答ありがとうございました！

通報する
お礼日時：2008/10/23 01:53

No.3

  • 回答者： notnot
  • 回答日時：

document.getSelection()で、選択部分の「文字列」は取得できますが、対応する部分のHTMLソースを得る方法は無さそうです。


http://developer.mozilla.org/en/DOM_Client_Objec …
    • good
    • 0
    • 件
通報する
この回答へのお礼

自分も探した結果なさそうだったのですが、どうしても必要で質問させて頂きました。
御回答ありがとうございました！

通報する
お礼日時：2008/10/23 01:45

No.2

  • 回答者： _pipi_
  • 回答日時：

あっファイル名はtest.htmlにして。


自分自身を呼び出しているので適当に変更してください？
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： _pipi_
  • 回答日時：

<html>


<body>
<input type="text" id="a">
<div>
マウスで範囲を選択します<br>
いやいや色々な表現方法があるものです<br>
どう利用するか、どう感じたかは人それぞれ<br>
function(){ javascript: ～　←これはまずい。
123 456 789<br>
</div>

<script>
document.getElementById('a').value = decodeURIComponent(location.search) ;
document.body.onmouseup = chk;
function chk(){
var key = getSelectText();
if(key=='') return;
window.open('test.html?title='+encodeURIComponent(key));
}

function getSelectText(){
return (/*@cc_on!@*/false)?((document.selection.type == 'Text')? document.selection.createRange().text:''):window.getSelection().getRangeAt(0);
}
</script>
</body>
    • good
    • 0
    • 件
通報する
この回答へのお礼

早速の御返事ありがとうございます。
ただ、自分の知識不足で使い方を過ってるだけかもしれませんが、少々望んでいるものと違いまして・・・
まず、FirefoxのURLを入力する欄で実行したいためhtmlではなくjavascript:～を用いて一行で実行したいこと。
テキストを取得するのではなく、HTMLソースを取得したいこと。（ページ上の"リンク"を選択した後にjavascriptを実行すると、<a href="http://www～">リンク</a>が取得できるといったものです）

もし自分の勘違いであった場合は申し訳ありません。
本当にありがとうございました。

通報する
お礼日時：2008/10/20 20:40

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

ページトップページトップ

おすすめ情報

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報