Html 如何在移动浏览器中查看查看源代码(Android 和功能手机)
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/24905940/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to check View Source in Mobile Browsers (Both Android && Feature Phone)
提问by Raaga
I need to check the view source of the page from mobile / tablet browsers ( Android Phones/Tablets and Feature Phones).
我需要从手机/平板电脑浏览器(Android 手机/平板电脑和功能手机)检查页面的查看源。
I tried some of the methods but is not feasible like in desktop. I feels difficult to check it.
我尝试了一些方法,但不像在桌面上那样可行。我觉得很难检查。
JS
JS
javascript: alert(document.getElementsByTagName('html')[0].innerHTML);
Chrome && Firefox (Android)
Chrome && Firefox (Android)
view-source:http://domain.com
Is it there any other method to check in other browsers and in featured phone browsers
是否有其他方法可以检查其他浏览器和特色手机浏览器
回答by intCoffee
You could try the remote debugging on Chrome for desktop to debug the code on Chrome for Android
您可以尝试在桌面版 Chrome 上进行远程调试,以在 Android 版 Chrome 上调试代码
https://developer.chrome.com/devtools/docs/remote-debugging
https://developer.chrome.com/devtools/docs/remote-debugging
There are several apps on Google Play that enables view source directly from the phone. Here is one: https://play.google.com/store/apps/details?id=com.androidyou.webpagelite&hl=en
Google Play 上有几个应用程序可以直接从手机查看源代码。这是一个:https: //play.google.com/store/apps/details?id=com.androidyou.webpagelite&hl=en
A quick search on Google Play lists multiple apps: https://play.google.com/store/search?q=view%20source&c=apps&hl=en
在 Google Play 上快速搜索列出多个应用程序:https: //play.google.com/store/search?q=view%20source&c=apps &hl=en
回答by Pritam Shetty
You can try this cool app available in play store called Html Page Source https://play.google.com/store/apps/details?id=com.scintillar.hps
您可以在 Play 商店中试用这款名为 Html 页面源的酷炫应用 https://play.google.com/store/apps/details?id=com.scintillar.hps
回答by Marian07
Now, adding view-source:
before the site-address.comworks on Chrome - Android.
Source: https://www.quora.com/How-can-I-view-a-webpage-source-code-in-Google-chrome-mobile-version
现在,view-source:
在site-address.com之前添加适用于 Chrome - Android。来源:https: //www.quora.com/How-can-I-view-a-webpage-source-code-in-Google-chrome-mobile-version
回答by Ben Barreth
The view-source url prefix trick didn't work for me using chrome on an iphone. There are apps I could have installed to do this I guess but for whatever reason I just preferred to do it myself rather than install 'yet another app'.
在 iPhone 上使用 chrome 时,查看源 url 前缀技巧对我不起作用。我想我可以安装一些应用程序来做到这一点,但无论出于何种原因,我都更喜欢自己做,而不是安装“另一个应用程序”。
I found this nice quick tutorial for how to setup a bookmark on mobile safari that will automatically open the view source of a page: https://appletoolbox.com/2014/03/how-to-view-webpage-html-source-codes-on-ipad-iphone-no-app-required/
我找到了这个关于如何在移动 Safari 上设置书签的快速教程,该书签将自动打开页面的查看源:https: //appletoolbox.com/2014/03/how-to-view-webpage-html-source- ipad-iphone-no-app-required/ 上的代码
It worked flawlessly for me and now I have it set as a permanent bookmark any time I want, with no app installed.
它对我来说完美无缺,现在我可以随时将其设置为永久书签,无需安装任何应用程序。
Edit: There are basically 6 steps which should work for either Chrome or Safari. Instructions for Safari are:
编辑:基本上有 6 个步骤适用于 Chrome 或 Safari。Safari 使用说明如下:
- Open Safari and browse to an arbitrary page.
- Select the "Share" (or action") button in Safari (looks like a square with an arrow coming out of the top).
- Select "Add Bookmark"
- Delete the page title and replace it with something useful like "Show Page Source". Click Save.
- Next browse to this exact Stack Overflow answer on your phone and copy the javascript code below to your phone clipboard (code credit: Rob Flaherty):
- 打开 Safari 并浏览到任意页面。
- 在 Safari 中选择“共享”(或操作)按钮(看起来像一个带有箭头的正方形)。
- 选择“添加书签”
- 删除页面标题并将其替换为诸如“显示页面源”之类的有用内容。单击保存。
- 接下来在您的手机上浏览到确切的 Stack Overflow 答案,并将下面的 javascript 代码复制到您的手机剪贴板(代码来源:Rob Flaherty):
javascript:(function(){var a=window.open('about:blank').document;a.write('<!DOCTYPE html><html><head><title>Source of '+location.href+'</title><meta name="viewport" content="width=device-width" /></head><body></body></html>');a.close();var b=a.body.appendChild(a.createElement('pre'));b.style.overflow='auto';b.style.whiteSpace='pre-wrap';b.appendChild(a.createTextNode(document.documentElement.innerHTML))})();
- Open the "Bookmarks" in Safari and opt to Edit the newly created Show Page Source bookmark. Delete whatever was previously saved in the Address field and instead paste in the Javascript code. Save it.
- (Optional) Profit!
- 在 Safari 中打开“书签”并选择编辑新创建的显示页面源书签。删除以前保存在地址字段中的任何内容,而是粘贴到 Javascript 代码中。保存。
- (可选)利润!
回答by Steve Litton
This is an old post but still a problem within the Chrome dev tools. I find the best way to check mobile source locally is to open the site locally in Xcode's iOS Simulator. Then from there you open the Safari browser and enable dev tools, if you have not already done this (go to preferences -> advanced -> show develop menu in menu bar). Now you will see the develop option in the main menu and can go to develop -> iOS Simulator -> and the page you have open in Xcode's iOS Simulator will be there. Once you click on it, it will open the web inspector and you can edit as you would normally in the browser dev tools.
这是一篇旧帖子,但在 Chrome 开发工具中仍然存在问题。我发现在本地检查移动源的最佳方法是在 Xcode 的 iOS 模拟器中本地打开该站点。然后从那里打开 Safari 浏览器并启用开发工具,如果您还没有这样做(转到首选项 -> 高级 -> 在菜单栏中显示开发菜单)。现在你将在主菜单中看到开发选项,可以去开发 -> iOS 模拟器 -> 你在 Xcode 的 iOS 模拟器中打开的页面将在那里。单击它后,它将打开网络检查器,您可以像往常一样在浏览器开发工具中进行编辑。
I'm afraid this solution will only work on a Mac though as it uses Xcode.
恐怕这个解决方案只能在 Mac 上运行,因为它使用 Xcode。
回答by FeRD
This question is a few years old, and there are some good suggestions for workarounds, but I didn't really notice any answers that address the core of the original question head-on. So:
这个问题已经有几年了,并且有一些很好的解决方法建议,但我并没有真正注意到任何正面解决原始问题核心的答案。所以:
Providing a "universal" method for viewing source in a feature phone browser (or even arbitrary third-party smartphone browser) is impossible because "view source" — via any method — is a feature implemented in the browser. So how it's accessed, or even if it canbe accessed, is up to the developers of the browser. I'm sure there are plenty of browsers that intentionally prevent the user from viewing page source, and if so then you're out of luck, except maybe for workarounds like the ones offered here.
Workarounds such as "view source" apps externalto the browser, while useful in some cases, are at best an imperfect partial solution to the original request. It's never certain that any such app will display the source of the page in the same formas it's loaded by the phone's browser.
Modern web content changes itself in all manner of ways through browser detection, session management, etc. so that the source loaded by any external app can never be relied on to represent the source as loaded by a different app. If you're going to use an external app to load a page because you want to see the source, you might as well just use Chrome (or, on an iOS device, Safari) instead.
提供在功能手机浏览器(甚至任意第三方智能手机浏览器)中查看源代码的“通用”方法是不可能的,因为“查看源代码”——通过任何方法——是浏览器中实现的功能。因此,如何访问,或者是否可以访问,取决于浏览器的开发人员。我敢肯定,有很多浏览器会故意阻止用户查看页面源代码,如果是这样,那么您就不走运了,除了像这里提供的解决方法。
诸如浏览器外部的“查看源”应用程序之类的变通方法虽然在某些情况下很有用,但充其量只是原始请求的不完美部分解决方案。永远无法确定任何此类应用程序是否会以与手机浏览器加载的相同形式显示页面源代码。
现代 Web 内容通过浏览器检测、会话管理等以各种方式改变自身,因此永远不能依赖任何外部应用程序加载的源来表示不同应用程序加载的源。如果您要使用外部应用程序加载页面,因为您想查看源代码,那么您最好使用 Chrome(或者,在 iOS 设备上,Safari)。