文档章节

ntv.js框架(第四章) - 机顶盒Javscript编写和调试方法

coton_chen
 coton_chen
发布于 2015/02/02 11:23
字数 639
阅读 1919
收藏 2

      在我们编写Javscript时,首先要分清楚2个概念,1是使用W3C标准来处理HTML DOM元素(例如修改标签HTML、文本、状态、形状等),2是使用中间件规范接口来处理音视频等业务功能(例如播放音视频等)。


1. 使用W3C标准来处理HTML DOM元素

   一般在PC浏览器上我们使用例如jQuery框架来简化W3C标准的接口,但机顶盒内置的浏览器不支持jQuery框架的所有属性方法,ntv.js框架暂时只提供了一些主要的方法实现,暂未能提供jQuery框架的所有属性方法实现。

代码示例:

W3C标准写法:

document.getElementById("div_id").innerHTML = "<p>title<p>";
document.getElementById("img_id").src = "http://ip/images/bg.png";

jQuery框架写法:

$("#div_id").html("<p>title<p>");
$("#img_id").attr("src", "http://ip/images/bg.png");

ntv.js框架写法:

$("#div_id").innerHTML = "<p>title<p>";
$("#img_id").src = "http://ip/images/bg.png";

通过代码你可以看出,ntv.js框架只简化了W3C标准常用的函数名,但对于元素的属性操作都仍旧采用W3C标准。


2. 使用中间件规范接口来处理音视频等业务功能

      在W3C发布HTML5标准之前,浏览器上实现音视频功能,一般做法是采用Adobe Flash方式。但在机顶盒浏览器上并不是采用这种方式,它有自己的私有标准实现,这个标准就是前面一直提到的 中间件规范。

ntv.js框架写法:

// 播放HTTP协议的音频
ntv.stb.mediaplayer.play("AUDIO", "http://ip/audio.mp3");
ntv.stb.mediaplayer.pause();
ntv.stb.mediaplayer.resume();
ntv.stb.mediaplayer.stop();


3. JavaScript调试方法:

      你可以在引用了框架脚本之后,通过使用如下代码来在页面上开启调试模式和输出调试信息。

ntv.log.debug = true;
ntv.log.console("调试信息")

注意事项:

1. 因为框架默认过滤日志信息,所以你在输出自定义的调试信息时,请不要使用 "ntv.**" 形式的字符串。ntv.log.console("ntv.**"); 是框架内置的日志输出形式。

2. 调试信息的显示只支持一屏,不支持自动滚动。所以在调试时尽量精简输出条数。

调试效果:

      

      框架内置了一些调试信息,用于开发者调试框架内特定模块功能,例如键值、焦点、媒体处理等。如果想要开启框架内的系统日志,请参考之后的源代码解读章节。


© 著作权归作者所有

coton_chen
粉丝 23
博文 25
码字总数 16287
作品 0
静安
架构师
私信 提问
加载中

评论(3)

coton_chen
coton_chen 博主

引用来自“xuzh86”的评论

您好,好东西,就是没找到源码的下载地址,可以发给我一份吗?weilaixiang@126.com,谢谢!!

http://git.oschina.net/ntv/ntv.js
x
xuzh86
您好,好东西,就是没找到源码的下载地址,可以发给我一份吗?weilaixiang@126.com,谢谢!!
爱睡觉的猫-
爱睡觉的猫-
没有找到源码下载地址,可以发我邮箱吗?351450496@qq.com.非常感谢0
ntv.js框架(第二章) - 源代码目录结构

源代码目录结构: css // 包含一些标签默认样式重置、常用class、组件所需的css样式 images // 包含了2张透明图,具体用处后续介绍(可选目录) js // 框架核心代码 js/effect // 框架提供的...

coton_chen
2015/01/27
0
0
ntv.js框架源码解读 - 4navigation.js

4navigation.js源代码: ntv.navigation类,处理页面焦点移动和确认、刷新等操作动作。 在讲解框架处理焦点移动前,先讲解下机顶盒上焦点移动的工作原理,以便开发者能更好的了解框架采用这种...

coton_chen
2015/04/29
0
4
ntv.js框架(第三章) - 机顶盒HTML和CSS编写注意事项

UI设计: 机顶盒的输出设备为电视机,电视机的图像重现率比计算机的显示器小,靠近边缘部分的文字与图像可能会在电视机中无法看到,所以在进行应用界面设计时,文字与图像尽量设计在屏幕中间...

coton_chen
2015/01/28
0
0
ntv.js框架源码解读 - 3key.js

3key.js源代码: ntv.key类,遥控器键值和系统消息的监听代理接口及遥控器键值的绑定。 ntv.key = function(){}; ntv.key.init = function(){ this.listener_keyevent(); // 键值事件监听,监...

coton_chen
2015/02/05
0
0
ntv.js框架源码解读 - 1common.js和2core.js

1common.js源代码: 全局 $ 对象,类似于jQuery框架的命名形式,用于缩短函数名,精简代码。此文件只包含提供全局作用域的常用对象。 var $ = function(selector){}; // Id选择器的函数封装。...

coton_chen
2015/02/04
0
0

没有更多内容

加载失败,请刷新页面

加载更多

springmvc java对象转json,上传下载(未完)拦截器Interceptor以及源码解析(未完待续)

package com.atguigu.my.controller;import java.util.Collection;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Contr......

architect刘源源
46分钟前
24
0
[日更-2019.5.24、25、26] Android系统中的Binder通信机制分析(一)--servicemanager

声明 其实对于Android系统Binder通信的机制早就有分析的想法,记得去年6、7月份Mr.Deng离职期间约定一起对其进行研究的,但因为我个人问题没能实施这个计划,留下些许遗憾... 最近,刚好在做...

Captain_小馬佩德罗
昨天
19
0
聊聊dubbo的DataStore

序 本文主要研究一下dubbo的DataStore DataStore dubbo-2.7.2/dubbo-common/src/main/java/org/apache/dubbo/common/store/DataStore.java @SPI("simple")public interface DataStore { ......

go4it
昨天
2
0
17.windows上安装kafka并简单应用

1.单机版 1.1 安装jdk 略 1.2 安装zookeeper https://my.oschina.net/springMVCAndspring/blog/3045210 1.3 安装window上安装kafka 1.3.1 下载 http://kafka.apache.org/downloads 1.3.2 解压......

20190513
昨天
2
0
缓存雪崩

缓存雪崩原因:大批次的缓存数据,同一时刻过期 解决方案: 1、尽可能避免所有缓存在同一时刻过期,即:合理调整过期策略 2、对条件加锁 伪代码: public ProductselectProduct(String id){ ...

少年已不再年少
昨天
10
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部