使用jsconsole调试手机

移动设备的Web开发有几个主要限制。

屏幕分辨率（从iPad到第一代Blackberry）差异很大，多种浏览器（Webkit以及IEMobile，Firefox，Opera mini和mobile等）和多种操作系统（Windows Phone，Android，iOS，Palm，Blackberry） ）。 每个设备都有其自身的约束和性能。

当需要调试所有这些时，这项任务并不容易，因为只有很少的工具允许它–并且由于屏幕的尺寸，即使那样我们也不是没有道理的。

Dragonfly for Opera已经提供了一种用于远程调试的本机解决方案，但是这种技术非常有限，尤其是在必须考虑其他移动/浏览器的情况下。 几家电话制造商还提供了仿真器，但它们与使用具有“触感”的真实设备的使用效果不一样-尤其是在Web客户端编程方面，尤其是JavaScript。

正是为了帮助我们完成jsconsole的这项艰巨任务。

移动版JavaScript控制台

转到以下地址： http : //jsconsole.com 。

Jsconsole允许您通过位于桌面上的控制台远程调试JavaScript应用程序，该控制台将用于直接在手机上进行调试。 打个比方，就好像您在远程使用Firebug JS控制台一样。

一方面，该工具将从您的手机检索对console.log的每次调用，并将其显示在桌面上。

另一方面，jsconsole允许您将JavaScript代码直接注入到页面中。

了解此工具通常仅在开发阶段或调试中使用，并且应始终在网站开始生产之前删除。

初始化jsconsole

第一步是在您的网站和jsconsole之间创建链接。 为此，请在控制台中输入第一个命令：

:listen

此命令将返回一个标识符和一个标记<script>以集成到您的网站。 您收到的代码将如下所示：

现在，您只需要将此行添加到HTML代码中所需的位置（例如，在标题中）。

如果最终经常使用此工具以避免为每个测试更改标签<script>，则可以通过指定以下命令来重复使用相同的标识符：

:listen FAE031CD-74A0-46D3-AE36-757BAB262BEA

同样，您也可以指定要使用的标识符。 例如：

:listen party

与此<script>一起：

<script src="http://jsconsole.com/remote.js?party"> </ script>

在您的网站上插入此代码后，您可以在网页中使用一行来测试连接，例如：

<script type="text/javascript">
console.log ("Connection");
</ script>

然后，使用移动设备登录到您的网站，并确保您已在桌面控制台上收到通知。

从jsconsole发送指令

正确建立连接后，您可以在手机上发送任何JavaScript代码行。 为此，您只需键入代码行即可直接在控制台中运行。
例如：

document.innerHTML = "Hello World !";

您还可以使用常规库，例如在您的站点上安装了jQuery，则可以发送以下代码：

$ ("# myElement") fadeOut ();

结论

那是对工具的概述，当我们为移动设备编程时，尤其是当我们使用与它们链接的功能时，此工具绰绰有余。 Jsconsole还具有其他不太重要的有趣功能。 为此，我邀请您阅读jsconsole网站的文档。

From: https://www.sitepoint.com/debugging-mobile-with-jsconsole/