Webページの特定の部分へのリンク

Question 1

自分が管理していない別のウェブサイトの長いウェブページの一部へのリンクを作成するにはどうすればよいですか？

リンクの最後にある#partofpageのバリエーションを使用できると思いました。助言がありますか？

Question 2

取得しようとして#いる<a>タグ（またはのような他のHTMLタグ<section>）のIDを後に追加するだけです。たとえば、このHTMLのヘッダーにリンクしようとしている場合：

<p>This is some content.</p>
<h2><a id="target">Some Header</a></h2>
<p>This is some more content.</p>

リンクを使用できます<a href="http://url.to.site/index.html#target">Link</a>。

Question 3

次の形式を使用して「ジャンプリンク」を作成します。

http://www.somesite.com/somepage#anchor

ここで、anchorは、そのページでリンクする要素のIDです。ブラウザ開発ツール/ソースの表示を使用して、リンクする要素のIDを見つけます。

要素にIDがなく、そのサイトを制御しない場合は、それを行うことはできません。

Question 4

これは、そのサイトがページでアンカーを宣言している場合にのみ可能です。タグに名前またはid属性を付けることで実行されるため、リンク先に近いものを探します。

そして、構文は次のようになります

<a href="page.html#anchor">text</a>

Question 5

ターゲットページが同じドメインにあり（つまり、ページと同じオリジンを共有している）、新しいタブの作成を気にしない場合（1）、JavaScriptを（乱用）使用できます。

<a href="javascript:void(window.open('./target.html').onload=function(){this.document.querySelector('p:nth-child(10)').scrollIntoView()})">see tenth paragraph on another page</a>

トリビア：

var w = window.open('some URL of the same origin');
w.onload = function(){
  // do whatever you want with `this.document`, like
  this.document.querySelecotor('footer').scrollIntoView()
}

今すぐ試すことができるこのような「エクスプロイト」の実例は次のとおりです。

javascript:(function(url,sel,w,el){w=window.open(url);w.addEventListener('load',function(){w.setTimeout(function(){el=w.document.querySelector(sel);el.scrollIntoView();el.style.backgroundColor='red'},1000)})})('/programming/45014240/link-to-a-specific-spot-on-a-page-i-cant-edit','footer')

これをロケーションバーに入力するか（Chromejavascript:がクリップボードから貼り付けるとプレフィックスを削除するhrefことに注意してください）、または（開発ツールを使用して）このページの任意のリンクの値にしてクリックすると、別の（重複した）SO質問ページがスクロールされますフッターとフッターは赤く塗られています。（ロード後にフッターを押し下げるajaxロードされたコンテンツの回避策として遅延が追加されました。）

ノート

現在のChromeとFirefoxでテストされていますが、定義された標準の動作に基づいているため、通常は機能するはずです。
SOのインタラクティブスニペットでは、ページの原点から分離されているため、説明できません。
MDN：Window.open（）
（1）イベントをwindow.open(url,'_self')中断しているようloadです。基本的にwindow.open、通常のa href=""クリックナビゲーションのように動作します。まだこれ以上研究していません。

Question 6

最初のオフターゲットとは、リンクしようとしているHTMLコードまたはchromes開発ツールのいずれかにあるBlockIDを指します。コードはそれぞれ異なり、参照しようとしているIDを見つけるために掘り下げる必要があります。これはdiv class="page-container drawer-page-content" id"PageContainer"、個々のテキストや画像ではなく、参照されるセクション全体の形式であることに注意してください。これを行うには、同じコードを見つける必要がありますが、ターゲットブロックに関連しています。たとえば、dv id="your-block-id"とにかく私はこのスレッドを読んでいて、アイデアが思い浮かびました。あなたがShopifyユーザーであり、これを実行したい場合、それは述べられていることとほとんど同じです。しかし、代わりに

> http://url.to.site/index.html#target

あなたが置くだろう

> http://storedomain.com/target

たとえば、ホームページにニュースレターの登録とショッピングブロックにつながるリンクを含む免責事項ページを設定しているのでhttps://mystore-classifier.com/#shopify-section-1528945200235、ハイパーリンクを挿入します。-classifierは私の内部使用のためのものであり、あなたには適用されないことに注意してください。これは、店舗を追跡できるようにするためです。あなたがあなたのホームページ以外のものにリンクしたいなら、あなたは置くでしょう

> http://mystore-classifier.com/pagename/#BlockID

誰かがこれがお役に立てば幸いです。私の説明に何か問題がある場合は、私はHTMLプログラマーではないので、私の言語はC＃です。

Question 7

今後のChromeの「テキストにスクロール」機能はまさにあなたが探しているものです。

https://github.com/bokand/ScrollToTextFragment

基本的に#targetText=URLの最後に追加すると、ブラウザはターゲットテキストまでスクロールし、ページが読み込まれた後にそれを強調表示します。

デスクで実行されているバージョンのChromeにありますが、現在は手動で有効にする必要があります。おそらく、本番環境のChromeビルドですぐにデフォルトで有効になり、他のブラウザもそれに続くので、今すぐリンクへの追加を開始して、それから機能し始めます。