记一次需求完成的经过，要获取iframe中的元素，然后在页面进行分段跳转和相关操作，途中遇到了几个问题，方便后续自我回忆。

问题一  chrome扩展开发中 Popup页面无法持续保持的问题 【未解决】

这个需求感觉真的很广泛，即每次的Popup页面会随着失去焦点而关闭，再次打开后页面会回到初始页面，无法在页面中记录一些数据后失去焦点依然保持配置或选项。

查询了很多相关资料，有说监听Popup失去焦点事件的，有说直接让焦点事件不关闭的。目前该问题依然未能解决。后续通过网页中写视窗定位（position:fixed）的窗体加载元素来实现了界面构造。

问题二 chrome扩展开发中 iframe中的元素无法获取的问题

通过直接$(‘selector’) 的方式无法直接获得iframe中的元素

需要先根据ID 或者其他属性来获得对应iframe元素

var pdf_obj = document.getElementById('1').contentWindow.document.getElementById('pdf-viewer')

然后将该对象转换为jquery 对象  js和jq的互转方式如下

$('js_obj')                  //  通过用$()包裹直接将js转换为jq

$('selector')[0]          //  通过0下标直接转换为js对象

转换为jq对象后 即可进行scroll(), keydown()等事件的绑定和执行

问题三   有一些iframe中的元素一开始是没有加载好的，无法获取

这个问题需要等待加载完成后才能进行相关操作，通过设置定时器(interval)进行轮询获取。获取成功后，删除定时器。

var ele_check_timer = setInterval(function(){
	var pdf_obj = document.getElementById('1').contentWindow.document.getElementById('pdf-viewer');
    if (pdf_obj){ 
        cleanInterval(ele_check_timer);
        do something; 
    }}, 3000});

问题四  每次需要在chrome扩展文件夹中进行代码调试很麻烦

可以在谷歌浏览器中直接调试代码，按下f12后进入console即可输入代码进行调试。

省去了来回切换。一般网站中都内置了有jquery 如果没有Jquery可以尝试从其他网站中包含过来。

有些网站仅支持指定域名 可以尝试使用百度的cdn 原出处 @山岚_

;(function(d,s){d.body.appendChild(s=d.createElement('script')).src='https://libs.baidu.com/jquery/2.0.0/jquery.min.js'})(document);

问题五 控制台console操作正确但是就是不能获得元素?

有时候不小心因为其他的操作改变了当前页面后(即从top到了index或者其他页面)会一直无法获取元素，将如下位置设置回到到TOP即可。

问题六  轮询获取标签中 会有错误提示 如何让错误不显示？【未解决】

查询到可以通过 try语法来检测错误 但是使用后控制台没有错误提示，chrome开发中心依然一直有错误提示，没有找到问题的根源。

记一次需求完成的经过，要获取iframe中的元素，然后在页面进行分段跳转和相关操作，途中遇到了几个问题，方便后续自我回忆。问题一 chrome扩展开发中 Popup页面无法持续保持的问题 【未解决】这个需求感觉真的很广泛，即每次的Popup页面会随着失去焦点而关闭，再次打开后页面会回到初始页面，无法在页面中记录一些数据后失去焦点依然保持配置或选项。查询了很多相关资料，有说监听Popup失去焦点事件的，有说直接让焦点事件不关闭的。目前该问题依然未能解决。后续通过网页中写视窗定位（positi. $ npm install -g vue-cli # create a new project using the template $ vue init YuraDev/vue- chrome -extension-template my-project # install dependencies and go! $ cd my-project $ npm install # or yarn $ npm run dev # or yarn dev ：脚本的后台工作 在网页上下文 中 运行 它可以添加新的UI面板和侧边栏，与检查的页面进行交互，获取有关网络请求的信息等等。 为了允许用户自定义 扩展 程序的行为，您可能希望提供一个选项页面。 弹出窗口-单击图标时将显示的页面（窗口） 标签-您的应用程序将在单独的标签 中 运行 ext-共享脚本 应用程序的说明，其权利和 对 iframe 的优缺点及应用场景的一点小结 浅谈 iframe 的优缺点及应用场景 iframe 创建包含另外一个文档的内联框架(即行内框架)，简而言之， iframe 标签是框架的一种形式，一般用来包含别的页面。 一、使用 iframe 的优缺点 1. iframe 能够把嵌入的网页原样展现出来； 2.模块分离，便于更改，如果有多个网页引用 iframe ，只需要修改 iframe 的内容，就可以实现调用的每一个页面内容的更改，方便快捷； 3.网页如果为了统一风格，头部和版本都是一样的 chrome ://flags/#same-site-by-default-cookies ，设置为 Disabled chrome ://flags/#cookies-without-same-site-must-be-secure ，设置为 Disabled 重启浏览器 参考:https://developer.aliyun.com/article/743364 1. < iframe > 标签： iframe 是个内联框架，是在页面里生成个内部框架。 2. <frameset> 标签：frameset 定义一个框架集，包含多个子框架，每个框架都有独立的文档。 1. < iframe > 标签 iframe 是个内联框架，是在页面里生成... 新版 chrome (80+)浏览器默认屏蔽所有三方cookie已经不是什么新闻了，具体原因这里不去深究，有大量 相关 文章介绍，由于目前许多网站都依赖三方cookie，因此该特性的推出还是造成了一些的影响，比如收集用户信息的广告商，而且主流的浏览器都跟进 chrome 的策略，已经成为了既定事实，本篇文章主要聚焦于各种解决方案，大家可以针对自身情况采用不同的解决办法。 SameSite cookie新增的属性，取值包括：Lax(默认),None,Strict 1.None：将关闭SameS. [chrome扩展] Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist [chrome扩展] Unchecked runtime.lastError: Could not establish connection. Receiving end does not exist m0_48851951: 其实就是你chrome里面的插件问题，去扩展里面取消掉一些插件就可以了 django搭建 - 本地服务器设置与配置 formurong: Django-3.2.9-py3-none-any.whl在哪下载呀 tkinter - 使用Pyinstall进行打包封装 杨金衡本衡: chrome 扩展开发 - 如何获得iframe中的元素 和 相关问题解答 大家一起学编程（python）: 就一个字，强 chrome 扩展开发 - 如何获得iframe中的元素 和 相关问题解答 John Zhuang: 文章写得很好，给大佬点赞一起学习，共同进步！