texboxにリンクがあります。ボタンをクリックすると、リンクのページのタイトルを取得したいと思います。javascriptまたはjQueryでどのようにそれを行うことができますか?
5 に答える
この投稿はあなたにスタートを与えることができます
ページが同じドメインにある場合は、ajaxリクエストを使用して、返されたDOMオブジェクトからタイトルを取得します。
別のドメインの場合は、非表示のIFrameをその場所に設定し、読み込まれたときに次のようなものを使用してタイトルを取得します。
document.getElementById('MyIframe').document.title
ほとんどの場合、バックエンドスクリプト/クローラーによって実行されます。サーバー側であなたのウェブページを取得し、AJAXによって解析されたデータを返します
このようなことを試してください
<a href="http://www.google.com" id="googleLink">Google</a>
<span id="titleGoesHere"></span>
-
$(document).ready( function() {
$('#googleLink').click(function(){
$.get(this.prop('href'), function(data) {
var $temp = $('<div id="tempData" />');
$temp.append(data);
var title = $('title', $temp);
$('#titleGoesHere').html(title.val());
});
});
});
セキュリティ上の理由から、ブラウザはスクリプト内から開始されるクロスオリジンHTTPリクエストを制限します。また、フロントエンドでクライアント側のJavascriptをWebスクレイピングに使用しているため、CORSエラーが発生する可能性があります。
..。
フロントエンドスクリプト内にしっかりととどまると、Any Origin、Whatever Origin、All Origins、crossoriginなどのクロスドメインツールを使用できます。スクレイプしようとしているサイトで機能するものを見つけるために、これらのいくつかをテストする必要があることがよくあります。
この投稿から、私はこの実用的で自己完結型のフィドルを書きました:
function replaceAll(str, find, replace) {
return str.replace(new RegExp(find, 'g'), replace);
}
const url = "https://www.facebook.com/"
$.getJSON('https://allorigins.me/get?url=' + encodeURIComponent(url) + '&callback=?', function(data){
const content = replaceAll(data.contents, "<script", "<meta");
$("#content").append(content);
const d = $("#content");
$('#title').text(d.find('title').text());
$('#description').text(d.find('meta[name=description]').attr("content") || "None");
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="content" style="display: none;">
</div>
<h3 id="title">Waiting...</h3>
<br/>
<p id="description">Waiting...</p>
いくつかのコメント: