xgqfrms™, xgqfrms® : xgqfrms's offical website of cnblogs! xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

google chrome goto special text by url All In One

google chrome goto special text by url All In One

goto text with highlight color by URL

https://chrome.google.com/webstore/detail/link-to-text-fragment/pbcodcjpfjdpcineamnnmbkkmkdpajjg

bug

demo

https://www.cnblogs.com/xgqfrms/p/15401157.html#:~:text=goto text with highlight color by url

#:~:text=your_page_text

https://web.dev/text-fragments/#browser-compatibility:~:text=The Text Fragments feature is supported,to the Safari and Firefox discussions.

encodeURIComponent

const { generateFragment } = await import('https://unpkg.com/text-fragments-polyfill/dist/fragment-generation-utils.js');

const result = generateFragment(window.getSelection());

if (result.status === 0) {
  let url = `${location.origin}${location.pathname}${location.search}`;

  const fragment = result.fragment;

  const prefix = fragment.prefix ?
    `${encodeURIComponent(fragment.prefix)}-,` :
    '';

  const suffix = fragment.suffix ?
    `,-${encodeURIComponent(fragment.suffix)}` :
    '';

  const textStart = encodeURIComponent(fragment.textStart);

  const textEnd = fragment.textEnd ?
    `,${encodeURIComponent(fragment.textEnd)}` :
    '';

  url += `#:~:text=${prefix}${textStart}${textEnd}${suffix}`;
  // 
  console.log('\n🎉 encoded url =', url);
}

https://unpkg.com/text-fragments-polyfill/dist/fragment-generation-utils.js

refs

https://web.dev/text-fragments/#browser-compatibility



©xgqfrms 2012-2020

www.cnblogs.com/xgqfrms 发布文章使用:只允许注册用户才可以访问!

原创文章,版权所有©️xgqfrms, 禁止转载 🈲️,侵权必究⚠️!


posted @ 2021-10-13 10:58  xgqfrms  阅读(60)  评论(5编辑  收藏  举报