是否有一种灵活的方法来修改可编辑元素的内容? [英] Is there a flexible way to modify the contents of an editable element?

问题描述

主题:

我正在创建一个 Google Chrome 扩展程序，它通过内容脚本和事件页面与网页交互.

如果用户单击被 editable 的元素，我会显示上下文菜单选项rel="noreferrer">chrome.contextMenus API.

这些选项就像常用输入文本的快捷方式.当用户单击一个选项时，一些文本会放置在光标位置的元素内.如果用户突出显示了文本，则将其删除.

<小时>

问题:

并非所有可编辑元素都可以以相同方式进行修改.

如果元素是一个简单的textarea，则可以通过实现此解决方案来实现所需的结果:

• 替换文本区域中的选定文本

但是，我不能假设我正在与普通的 textarea 进行交互.

可能的细微差别包括:

• 文本区域隐藏在 Iframe 中，这使查找要与之交互的元素的过程变得复杂(document.activeElement 可能会返回 iframe，而不是实际包含文本的元素).

• </code> 根本不是 <code><textarea></code>/<code><input></code>，而是一个<a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_Editable" rel="noreferrer"><code>contentEditable </p><div></code></a>.<code>.value</code> 方法在这种情况下不起作用.</p></li></ul><p>所以我正在寻找一种灵活的方法来做到这一点，它可以优雅地处理所有边缘情况.</p><小时><h2>我尝试过的一些解决方案:</h2><ul><li><strong>选项 1:</strong><br>我最初计划将值存储在系统剪贴板中.然后，我可以想象只使用 <code>document.execCommand('paste')</code> 来修改元素.但是，在尝试之后，这种方法似乎与我最初的方法具有相同的缺点.(参见<a href="https://stackoverflow.com/questions/28130521/is-it-possible-to-fully-mimic-clipboard-functionality-using-the-chrome-extension">这个问题</a>) <br> <br> 此外，这种方法会在操作前删除剪贴板中的任何内容.这是不可取的，任何使用这种方法的解决方案都必须提供解决方法.<br><br></li><li><strong>选项 2:</strong> <br>我考虑过的另一个选择是为字符串中的每个字符调度键盘事件.但是，使用此解决方案，您仍然会遇到 <code>Iframe</code> 问题，并且它不允许您使用特殊的 Unicode 字符.┻━┻ ︵ヽ(`Д´)ﾉ︵ ┻━┻</li></ul></p><div class="h2_lin"> 解决方案 </div><p>您的问题由两个子问题组成:</p><ol><li>确定上下文菜单操作的目标元素.</li><li>在插入符号处插入自定义文本片段(删除任何存在的选择).</li></ol><p><h2>子问题1:识别目标元素</h2><ul><li>如果 <a href="https://code.google.com/p/chromium/issues/detail?id=39507" rel="noreferrer" title="context menu API 需要提供一种获取方式实际的 DOM 节点">crbug.com/39507</a> 已解析，然后获取元素很容易.此功能请求已将近 5 年没有任何进展，因此不要对它寄予厚望.替代方法要求您将问题 1 分解为另外两个子问题:识别目标框架，然后选择目标 DOM 元素.</li></ul><p>有几个 API 可以帮助识别框架(使用它们的组合，选择最适合您情况的组合):</p><ul><li><a href="https://developer.chrome.com/extensions/contextMenus#event-onClicked" rel="noreferrer"><code>contextMenus.onClicked</code></a> 事件提供了选项卡的 ID (<code>tab.id</code>) 作为 <a href="https://developer.chrome.com/extensions/tabs#type-Tab" rel="noreferrer"> 实例中的属性tabs.Tab</a> 和框架的 URL(<a href="https://developer.chrome.com/extensions/contextMenus#property-info-frameUrl" rel="noreferrer"><code>frameUrl</code></a>) 在一个单独的对象中.</li><li><a href="https://developer.chrome.com/extensions/tabs#method-executeScript" rel="noreferrer"><code>chrome.tabs.executeScript</code></a> 方法可以直接在frame中运行脚本.<br>(目前只有顶级框架或所有框架，针对特定框架的工作正在进行中 - <a href="https://code.google.com/p/chromium/issues/detail?id=63979" rel="noreferrer">crbug.com/63979</a>，计划用于 Chrome 42).<br>在实现针对特定框架之前，您可以在每个框架中插入内容脚本并将 URL 与 <code>frameUrl</code> 进行比较(或使用下一个方法的组合).</li><li>假设您已经插入了一个带有 <a href="https://developer.chrome.com/extensions/runtime#event-onMessage" rel="noreferrer"><code>chrome.runtime 的内容脚本.onMessage</code></a> 监听器，使用 <a href="https://developer.chrome.com/extensions/tabs#method-sendMessage" rel="noreferrer"><code>chrome.tabs.sendMessage</code></a> 将消息发送到由 <code>frameId</code> 标识的特定框架(自 Chrome 41 起).</li><li>使用 <a href="https://developer.chrome.com/extensions/webNavigation#method-getAllFrames" rel="noreferrer"><code>chrome.webNavigation.getAllFrames</code></a>获取给定 <code>tabId</code> 标签中所有帧列表的方法，然后通过已知 <code> 过滤帧列表来获取目标帧的 <code>frameId</code>frameUrl</code>.</li><li>(在未来(Chrome 42?)，<code>contextMenus.onClicked</code> 将获得 <code>frameId</code>).</li></ul><p>好的，假设你有正确的框架，你可以简单地使用 <code>document.activeElement</code> 来获取目标元素，因为输入元素会专注于点击.</p><h2>子问题 2:在插入符号处插入文本片段</h2><p>如果目标元素是<code><textarea></code>或<code><input></code>，那么你可以简单地使用</p><pre class="lang-js prettyprint-override"><code>//假设:elem 是一个 input 或 textarea 元素.var YOURSTRING = '随便';var start = elem.selectionStart;var end = elem.selectionEnd;elem.value = elem.value.slice(0, start) + YOURSTRING + elem.value.substr(end);//在选定文本后设置光标elem.selectionStart = start + YOURSTRING.length;elem.selectionEnd = elem.selectionStart;</code></pre><p>否则，您需要知道是否有内容可编辑元素，如果有，则删除任何选择(如果存在)，最后将您想要的文本放在那里.</p><pre class="lang-js prettyprint-override"><code>var elem = document.activeElement;if (elem && elem.isContentEditable) {//之前定义的你的字符串var newNode = document.createTextNode(YOURSTRING);var sel = window.getSelection();//删除之前的选择，如果有的话.sel.deleteFromDocument();//如果选择中没有范围，则添加一个新的，使用//将插入符号设置为输入元素的末尾以避免下一个错误://无法在 'Selection' 上执行 'getRangeAt':0 不是有效索引."如果(sel.rangeCount === 0){sel.addRange(document.createRange());sel.getRangeAt(0).collapse(elem, 1);}//插入新文本var range = sel.getRangeAt(0);range.insertNode(newNode);//现在，将光标设置到文本节点的末尾sel.collapse(newNode, 1);}</code></pre><p>上一个示例中使用的 Web 平台 API 的相关文档:</p><ul><li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Selection" rel="noreferrer"><code>Selection</code></a></莉><li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Selection.deleteFromDocument" rel="noreferrer"><code>Selection.deleteFromDocument()</code></a></li><li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Selection.collapse" rel="noreferrer"><code>Selection.collapse</code></一个></li><li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Range" rel="noreferrer"><code>范围</code></a></莉><li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Range.insertNode" rel="noreferrer"><code>Range.insertNode</code></一个></li></ul><h2>Subject:</h2> <p>I am creating a Google Chrome extension that interacts with web pages via a content script and an event page. </p> <p>I have context menu options that appear if a user clicks on an element that is categorized as <code>editable</code> by the <a href="https://developer.chrome.com/extensions/contextMenus" rel="noreferrer"><code>chrome.contextMenus</code> API</a>. </p> <p>The options act like shortcuts for commonly entered text. When the user clicks an option, some text is placed inside the element at the position of the cursor. If the user has text highlighted, it is deleted. </p> <hr> <h2>Problem:</h2> <p>Not all editable elements can be modified the same way. </p> <p>If the element is a simple <code>textarea</code> the desired result can be achieved by implementing this solution:</p> <ul> <li><a href="https://stackoverflow.com/questions/3964710/replacing-selected-text-in-the-textarea">Replacing selected text in the textarea</a></li> </ul> <p>However, I can not assume that I am interacting with a normal <code>textarea</code>. </p> <p>Possible nuances include:</p> <ul> <li><p>The text area being hidden inside an <code>Iframe</code>, which complicates the process of finding the element to interact with (<code>document.activeElement</code> may return the <code>Iframe</code>, rather than the element that actually contains the text).</p></li> <li><p>The <code><textarea></code> not being a <code><textarea></code>/<code><input></code> at all, but rather a <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_Editable" rel="noreferrer"><code>contentEditable <div></code></a>. The <code>.value</code> approach will not work in this case.</p></li> </ul> <p>So I am searching for a flexible way to do this that can handle all edge cases elegantly. </p> <hr> <h2>Some solutions I have tried:</h2> <ul> <li><strong>option 1 :</strong><br> I originally planned on storing the value in the system clipboard. Then, I could conceivably just use <code>document.execCommand('paste')</code> to modify the element. However, after trying it, this approach seems to have the same drawbacks as my initial approach. (See <a href="https://stackoverflow.com/questions/28130521/is-it-possible-to-fully-mimic-clipboard-functionality-using-the-chrome-extension">this question</a>) <br> <br> Additionally, this approach would delete whatever was in the clipboard before the operation. This is undesirable and any solution that utilizes this approach must provide a work around. <br><br></li> <li><strong>option 2 :</strong> <br> Another option that I have considered is dispatching keyboard events for each character in the string. However, with this solution, you still run into the <code>Iframe</code> problem and it doesn't allow you do use special Unicode characters. ┻━┻ ︵ヽ(`Д´)ﾉ︵ ┻━┻</li> </ul> </p><div class="h2_lin"> 解决方案 </div><p>Your problem consists of two subproblems:</p><ol> <li>Identify the target element of the contextmenu action.</li> <li>Insert a custom text fragment at the caret (remove any selection if it is present).</li> </ol><p> <h2>Subproblem 1: Identifying the target element</h2> <ul> <li>If <a href="https://code.google.com/p/chromium/issues/detail?id=39507" rel="noreferrer" title="context menu API needs to provide a way to get at the actual DOM node">crbug.com/39507</a> is resolved, then getting the element is easy. This feature request is almost 5 year old without any progress, so don't get your hopes high on this one. Alternative methods require you to break problem 1 in two more subproblems: Identifying the target frame, and then select the target DOM element.</li> </ul> <p>There are several APIs that help with identifying the frame (use a combination of them, choose whichever combination fits best in your situation):</p> <ul> <li>The <a href="https://developer.chrome.com/extensions/contextMenus#event-onClicked" rel="noreferrer"><code>contextMenus.onClicked</code></a> event provides the tab's ID (<code>tab.id</code>) as a property in an instance of <a href="https://developer.chrome.com/extensions/tabs#type-Tab" rel="noreferrer">tabs.Tab</a> and the frame's URL (<a href="https://developer.chrome.com/extensions/contextMenus#property-info-frameUrl" rel="noreferrer"><code>frameUrl</code></a>) in a separate object.</li> <li>The <a href="https://developer.chrome.com/extensions/tabs#method-executeScript" rel="noreferrer"><code>chrome.tabs.executeScript</code></a> method can directly run a script in a frame.<br> (currently only the top-level frame or all frames, targetting a specific frame is work in progress - <a href="https://code.google.com/p/chromium/issues/detail?id=63979" rel="noreferrer">crbug.com/63979</a>, planned for Chrome 42).<br> Until targetting a specific frame is implemented, you could insert the content script in every frame and compare the URL with <code>frameUrl</code> (or use a combination of the next methods).</li> <li>Assuming that you have already inserted a content script with a <a href="https://developer.chrome.com/extensions/runtime#event-onMessage" rel="noreferrer"><code>chrome.runtime.onMessage</code></a> listener, use <a href="https://developer.chrome.com/extensions/tabs#method-sendMessage" rel="noreferrer"><code>chrome.tabs.sendMessage</code></a> to send a message to a specific frame identified by <code>frameId</code> (since Chrome 41).</li> <li>Use the <a href="https://developer.chrome.com/extensions/webNavigation#method-getAllFrames" rel="noreferrer"><code>chrome.webNavigation.getAllFrames</code></a> method to get a list of all frames in a tab for a given <code>tabId</code>, then get the <code>frameId</code> of the target frame by filtering the list of frames by a known <code>frameUrl</code>.</li> <li>(in the future (Chrome 42?), <code>contextMenus.onClicked</code> will get the <code>frameId</code>).</li> </ul> <p>Okay, assuming that you have the correct frame, you can simply use <code>document.activeElement</code> to get the target element, because input elements get focused upon click.</p> <h2>Subproblem 2: Inserting a text fragment at the caret</h2> <p>If the target element is a <code><textarea></code> or <code><input></code>, then you can simply use</p><pre class="lang-js prettyprint-override"><code>// Assume: elem is an input or textarea element. var YOURSTRING = 'whatever'; var start = elem.selectionStart; var end = elem.selectionEnd; elem.value = elem.value.slice(0, start) + YOURSTRING + elem.value.substr(end); // Set cursor after selected text elem.selectionStart = start + YOURSTRING.length; elem.selectionEnd = elem.selectionStart; </code></pre><p>Otherwise, you need to know whether there is a content editable element, and if so, remove any selection if existent, and finally put your desired text over there.</p><pre class="lang-js prettyprint-override"><code>var elem = document.activeElement; if (elem && elem.isContentEditable) { // YOURSTRING as defined before var newNode = document.createTextNode(YOURSTRING); var sel = window.getSelection(); // Remove previous selection, if any. sel.deleteFromDocument(); // If there is no range in the selection, add a new one, with the // caret set to the end of the input element to avoid the next error: //"Failed to execute 'getRangeAt' on 'Selection': 0 is not a valid index." if (sel.rangeCount === 0) { sel.addRange(document.createRange()); sel.getRangeAt(0).collapse(elem, 1); } // Insert new text var range = sel.getRangeAt(0); range.insertNode(newNode); // Now, set the cursor to the end of your text node sel.collapse(newNode, 1); } </code></pre><p>Relevant documentation for the web platform APIs used in the last example:</p> <ul> <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Selection" rel="noreferrer"><code>Selection</code></a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Selection.deleteFromDocument" rel="noreferrer"><code>Selection.deleteFromDocument()</code></a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Selection.collapse" rel="noreferrer"><code>Selection.collapse</code></a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Range" rel="noreferrer"><code>Range</code></a></li> <li><a href="https://developer.mozilla.org/en-US/docs/Web/API/Range.insertNode" rel="noreferrer"><code>Range.insertNode</code></a></li> </ul> <p>这篇关于是否有一种灵活的方法来修改可编辑元素的内容?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！</p> </div> <div class="arc-body-main-more"> <span onclick="unlockarc('2684472');">查看全文</span> </div> </div> <div> </div> <div class="wwads-cn wwads-horizontal" data-id="166" style="max-width:100%;border: 4px solid #666;"></div> </div> </article> <div id="arc-ad-2" class="mb-1"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5038752844014834" crossorigin="anonymous"></script> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5038752844014834" data-ad-slot="3921941283"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> <div class="widget bgwhite radius-1 mb-1 shadow widget-rel"> <h5>相关文章</h5> <ul> <li> <a target="_blank" title="是否有灵活的方法来修改可编辑元素的内容？" href="/651039.html"> 是否有灵活的方法来修改可编辑元素的内容？; </a> </li> <li> <a target="_blank" title="有没有一种简单的方法来编辑/修改UILocalNotification" href="/916694.html"> 有没有一种简单的方法来编辑/修改UILocalNotification; </a> </li> <li> <a target="_blank" title="有没有一种简单的方法来编辑/修改 UILocalNotification" href="/2777200.html"> 有没有一种简单的方法来编辑/修改 UILocalNotification; </a> </li> <li> <a target="_blank" title="是否有一种方法来构建版本的CKEditor未经修改" href="/510398.html"> 是否有一种方法来构建版本的CKEditor未经修改; </a> </li> <li> <a target="_blank" title="是否有一种方法来创建子类？" href="/512645.html"> 是否有一种方法来创建子类？; </a> </li> <li> <a target="_blank" title="PHP - 是否有一种安全的方法来执行深度递归?" href="/2369437.html"> PHP - 是否有一种安全的方法来执行深度递归?; </a> </li> <li> <a target="_blank" title="是否有一种方法来保护类变量不在函数之外被修改" href="/512824.html"> 是否有一种方法来保护类变量不在函数之外被修改; </a> </li> <li> <a target="_blank" title="是否有一种简单/内置的方法来获取 XAML 元素的精确副本(克隆)?" href="/2660964.html"> 是否有一种简单/内置的方法来获取 XAML 元素的精确副本(克隆)?; </a> </li> <li> <a target="_blank" title="是否有一种方法来识别版本的c / c ++库？" href="/490533.html"> 是否有一种方法来识别版本的c / c ++库？; </a> </li> <li> <a target="_blank" title="是否有另一种方法来启动远程jvm？" href="/990442.html"> 是否有另一种方法来启动远程jvm？; </a> </li> <li> <a target="_blank" title="是否有一种纯粹的基于 Promise 的方法来映射/连接集合?" href="/2735326.html"> 是否有一种纯粹的基于 Promise 的方法来映射/连接集合?; </a> </li> <li> <a target="_blank" title="是否有一种简单的方法来获取Stream作为RowParser的输出?" href="/1753026.html"> 是否有一种简单的方法来获取Stream作为RowParser的输出?; </a> </li> <li> <a target="_blank" title="是否有一种快速简便的方法来转储 MacOS X 钥匙串的内容?" href="/2567529.html"> 是否有一种快速简便的方法来转储 MacOS X 钥匙串的内容?; </a> </li> <li> <a target="_blank" title="是否有一种与环境无关的方法来检测Javascript主机对象？" href="/1059284.html"> 是否有一种与环境无关的方法来检测Javascript主机对象？; </a> </li> <li> <a target="_blank" title="是否有一种方法来指定嵌套STL向量C ++的维度？" href="/477258.html"> 是否有一种方法来指定嵌套STL向量C ++的维度？; </a> </li> <li> <a target="_blank" title="是否有一种方法来声明模板化函数的类型名称？" href="/493020.html"> 是否有一种方法来声明模板化函数的类型名称？; </a> </li> <li> <a target="_blank" title="是否有一种简单的方法来为一个glob设置nullglob" href="/1883646.html"> 是否有一种简单的方法来为一个glob设置nullglob; </a> </li> <li> <a target="_blank" title="有没有一种安全，可编程的方法来确定打开Swing窗口是否安全？" href="/979496.html"> 有没有一种安全，可编程的方法来确定打开Swing窗口是否安全？; </a> </li> <li> <a target="_blank" title="使用hibernate标准，是否有一种方法来转义特殊字符？" href="/595463.html"> 使用hibernate标准，是否有一种方法来转义特殊字符？; </a> </li> <li> <a target="_blank" title="是否有一种简洁的方法来迭代Java 8中的索引流？" href="/955504.html"> 是否有一种简洁的方法来迭代Java 8中的索引流？; </a> </li> <li> <a target="_blank" title="是否有一种简单快捷的方法来检查多边形是否自相交?" href="/2816771.html"> 是否有一种简单快捷的方法来检查多边形是否自相交?; </a> </li> <li> <a target="_blank" title="是否有一种很好的方法来确定文件是否可以在Java中执行" href="/968588.html"> 是否有一种很好的方法来确定文件是否可以在Java中执行; </a> </li> <li> <a target="_blank" title="是否有一种速记方法来更新球拍中的特定结构字段?" href="/2360431.html"> 是否有一种速记方法来更新球拍中的特定结构字段?; </a> </li> <li> <a target="_blank" title="简单 - 寻找一种方法来做元素存在检查.." href="/1062066.html"> 简单 - 寻找一种方法来做元素存在检查..; </a> </li> <li> <a target="_blank" title="是否有一种简单的方法来动态缩进div中的每一行？" href="/876772.html"> 是否有一种简单的方法来动态缩进div中的每一行？; </a> </li> </ul> </div> <div class="mb-1"> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-5038752844014834" crossorigin="anonymous"></script> <ins class="adsbygoogle" style="display:block" data-ad-format="autorelaxed" data-ad-client="ca-pub-5038752844014834" data-ad-slot="3921941283"></ins> <script> (adsbygoogle = window.adsbygoogle || []).push({}); </script> </div> </div> <div class="side"> <div class="widget widget-side bgwhite mb-1 shadow"> <h5>前端开发最新文章</h5> <ul> <li> <a target="_blank" title="为什么Chrome（在Electron内部）突然重定向到chrome-error：// chromewebdata？" href="/1996151.html"> 为什么Chrome（在Electron内部）突然重定向到chrome-error：// chromewebdata？; </a> </li> <li> <a target="_blank" title="错误102（net :: ERR_CONNECTION_REFUSED）：服务器拒绝连接" href="/749568.html"> 错误102（net :: ERR_CONNECTION_REFUSED）：服务器拒绝连接; </a> </li> <li> <a target="_blank" title="如何解决'重定向已被CORS策略阻止：没有'Access-Control-Allow-Origin'标题'？" href="/1009885.html"> 如何解决'重定向已被CORS策略阻止：没有'Access-Control-Allow-Origin'标题'？; </a> </li> <li> <a target="_blank" title="如何处理“Uncaught（in promise）DOMException：play（）失败，因为用户没有首先与文档交互。”在桌面上使用Chrome 66？" href="/884909.html"> 如何处理“Uncaught（in promise）DOMException：play（）失败，因为用户没有首先与文档交互。”在桌面上使用Chrome 66？; </a> </li> <li> <a target="_blank" title="警告：添加非被动事件侦听器到滚动阻塞'touchstart'事件" href="/818517.html"> 警告：添加非被动事件侦听器到滚动阻塞'touchstart'事件; </a> </li> <li> <a target="_blank" title="如何在浏览器中播放.TS文件（视频/ MP2T媒体类型）？" href="/343346.html"> 如何在浏览器中播放.TS文件（视频/ MP2T媒体类型）？; </a> </li> <li> <a target="_blank" title="此请求已被阻止;内容必须通过HTTPS提供" href="/886417.html"> 此请求已被阻止;内容必须通过HTTPS提供; </a> </li> <li> <a target="_blank" title="资源解释为样式表，但转换为MIME类型text / html（似乎与web服务器无关）" href="/562873.html"> 资源解释为样式表，但转换为MIME类型text / html（似乎与web服务器无关）; </a> </li> <li> <a target="_blank" title="通过HTTPS加载页面但请求不安全的XMLHttpRequest端点" href="/885901.html"> 通过HTTPS加载页面但请求不安全的XMLHttpRequest端点; </a> </li> <li> <a target="_blank" title="拒绝从执行脚本'*'，因为它的MIME类型（“应用/ JSON'）不是可执行文件，并严格MIME类型检查被启用。" href="/47347.html"> 拒绝从执行脚本'*'，因为它的MIME类型（“应用/ JSON'）不是可执行文件，并严格MIME类型检查被启用。; </a> </li> </ul> </div> <div class="widget widget-side bgwhite mb-1 shadow"> <h5> 热门教程 </h5> <ul> <li> <a target="_blank" title="Java教程" href="/OnLineTutorial/java/index.html"> Java教程 </a> </li> <li> <a target="_blank" title="Apache ANT 教程" href="/OnLineTutorial/ant/index.html"> Apache ANT 教程 </a> </li> <li> <a target="_blank" title="Kali Linux教程" href="/OnLineTutorial/kali_linux/index.html"> Kali Linux教程 </a> </li> <li> <a target="_blank" title="JavaScript教程" href="/OnLineTutorial/javascript/index.html"> JavaScript教程 </a> </li> <li> <a target="_blank" title="JavaFx教程" href="/OnLineTutorial/javafx/index.html"> JavaFx教程 </a> </li> <li> <a target="_blank" title="MFC 教程" href="/OnLineTutorial/mfc/index.html"> MFC 教程 </a> </li> <li> <a target="_blank" title="Apache HTTP客户端教程" href="/OnLineTutorial/apache_httpclient/index.html"> Apache HTTP客户端教程 </a> </li> <li> <a target="_blank" title="Microsoft Visio 教程" href="/OnLineTutorial/microsoft_visio/index.html"> Microsoft Visio 教程 </a> </li> </ul> </div> <div class="widget widget-side bgwhite mb-1 shadow"> <h5> 热门工具 </h5> <ul> <li> <a target="_blank" title="Java 在线工具" href="/Onlinetools/details/4"> Java 在线工具 </a> </li> <li> <a target="_blank" title="C(GCC) 在线工具" href="/Onlinetools/details/6"> C(GCC) 在线工具 </a> </li> <li> <a target="_blank" title="PHP 在线工具" href="/Onlinetools/details/8"> PHP 在线工具 </a> </li> <li> <a target="_blank" title="C# 在线工具" href="/Onlinetools/details/1"> C# 在线工具 </a> </li> <li> <a target="_blank" title="Python 在线工具" href="/Onlinetools/details/5"> Python 在线工具 </a> </li> <li> <a target="_blank" title="MySQL 在线工具" href="/Onlinetools/Dbdetails/33"> MySQL 在线工具 </a> </li> <li> <a target="_blank" title="VB.NET 在线工具" href="/Onlinetools/details/2"> VB.NET 在线工具 </a> </li> <li> <a target="_blank" title="Lua 在线工具" href="/Onlinetools/details/14"> Lua 在线工具 </a> </li> <li> <a target="_blank" title="Oracle 在线工具" href="/Onlinetools/Dbdetails/35"> Oracle 在线工具 </a> </li> <li> <a target="_blank" title="C++(GCC) 在线工具" href="/Onlinetools/details/7"> C++(GCC) 在线工具 </a> </li> <li> <a target="_blank" title="Go 在线工具" href="/Onlinetools/details/20"> Go 在线工具 </a> </li> <li> <a target="_blank" title="Fortran 在线工具" href="/Onlinetools/details/45"> Fortran 在线工具 </a> </li> </ul> </div> </div> </div> <script type="text/javascript">var eskeys = '是否,有,一种,灵活,的,方法来,修改,可,编辑,元素,的,内容'; var cat = 'cc';';//qianduan</script> </div> <div id="pop" onclick="pophide();"> <div id="pop_body" onclick="event.stopPropagation();"> <h6 class="flex flex101"> 登录 <span onclick="pophide();">关闭</span> </h6> <div class="pd-1"> <div class="wxtip center"> <span>扫码关注<em>1秒</em>登录</span> </div> <div class="center"> <img id="qr" src="https://huajiakeji.com/Content/Images/qrydx.jpg" alt="" style="width:150px;height:150px;" /> </div> <div style="margin-top:10px;display:flex;justify-content: center;"> <input type="text" placeholder="输入验证码" id="txtcode" autocomplete="off" /> <input id="btngo" type="button" onclick="chk()" value="GO" /> </div> <div class="center" style="margin: 4px; font-size: .8rem; color: #f60;"> 发送“验证码”获取 <em style="padding: 0 .5rem;">|</em> <span style="color: #01a05c;">15天全站免登陆</span> </div> <div id="chkinfo" class="tip"></div> </div> </div> </div> <script type="text/javascript" src="https://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> <script type="text/javascript" src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.min.js"></script> <script type="text/javascript" src="https://img01.yuandaxia.cn/Scripts/highlight.min.js"></script> <script type="text/javascript" src="https://img01.yuandaxia.cn/Scripts/base.js?v=0.22"></script> <script type="text/javascript" src="https://img01.yuandaxia.cn/Scripts/tui.js?v=0.11"></script> <footer class="footer"> <div class="container"> <div class="flink mb-1"> 友情链接： <a href="https://www.it1352.com/" target="_blank">IT屋</a> <a href="https://huajiakeji.com/" target="_blank">Chrome插件</a> <a href="https://www.cnplugins.com/" target="_blank">谷歌浏览器插件</a> </div> <section class="copyright-section"> <a href="https://www.it1352.com" title="IT屋-程序员软件开发技术分享社区">IT屋</a> ©2016-2022 <a href="http://www.beian.miit.gov.cn/" target="_blank">琼ICP备2021000895号-1</a> <a href="/sitemap.html" target="_blank" title="站点地图">站点地图</a> <a href="/Home/Tags" target="_blank" title="站点标签">站点标签</a> <a target="_blank" alt="sitemap" href="/sitemap.xml">SiteMap</a> <a href="/1155981.html" title="IT屋-免责申明"><免责申明></a> 本站内容来源互联网,如果侵犯您的权益请联系我们删除. </section> <!--统计代码--> <script type="text/javascript"> var _hmt = _hmt || []; (function() { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?0c3a090f7b3c4ad458ac1296cb5cc779"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> <script type="text/javascript"> (function () { var bp = document.createElement('script'); var curProtocol = window.location.protocol.split(':')[0]; if (curProtocol === 'https') { bp.src = 'https://zz.bdstatic.com/linksubmit/push.js'; } else { bp.src = 'http://push.zhanzhang.baidu.com/push.js'; } var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(bp, s); })(); </script> </div> </footer> </body> </html>