说三道四技术文摘-感悟人生的经典句子
说三道四 > 文档快照

实例剖析:如何用Foundation For Apps创建完美Web应用

HTML文档下载 WORD文档下载 PDF文档下载
不久前,Zurb推出了单页面App框架Foundation for Apps,其与Foundation 5密切相关。它试图提供一种开发Web应用既快速又简单的方法,本文通过实战案例,分析了该框架的使用方法,是一份综合性指南。

【编者按】本文是Smashing Magazine中《Creating A Complete Web App In Foundation For Apps》一文的简译内容,详细描述了用Foundation For Apps创建完美Web应用“星球大战知识库”的全过程。

Foundation for Apps是Zurb推出的一个新型单页面App框架,与Foundation 5(也称为Foundation for Sites,一个广泛使用的前端框架)密切相关。它围绕AngularJS和弹性网格框架构建而成。它试图让Web应用的开发过程既快速又简单,开发者可以快速开始编写针对应用的独一无二的代码,而非模板文件。

Foundation for Apps于2014年年底发布,尚未被广泛使用,因此有关如何使用这一框架的优质信息源比较少。本文将作为一篇综合指南,对构建一个功能性移动App的全过程进行介绍。文中的技术细节是为客户打造应用程序的基础,本教程也可看作是对AngularJS和单页应用在更广阔范围下如何使用的有力说明。

根据今年后半年即将上映的一部新电影,我们将构建一个“星球大战知识库”。它是一个使用RESTful API、缓存和Foundation for Apps、AngularJS多个特性的响应式Web应用程序。

想要直接跳到干货?

  • DEMO观看;
  • 在GitHub上查看;
  • 文件下载。

入门指南

快速浏览官方文档,其对设计样式进行了很好解释,但并没有对应用程序功能进行详细说明。将这一卓越的AngularJS文档放在手边,并牢牢记住Foundation for Apps提供了一些标准之外的服务,AngularJS的一些功能可能无法直接使用。同样要注意,AngularJS 和Foundation for Apps与生俱来就不太适用于对SEO有要求的App,因为大部分内容需要通过AJAX加载。

我们的应用程序将从Star Wars API(在SWAPI中)中提取数据。先浏览下SWAPI文档,了解其中的数据和结构。为了简单起见,我们的应用程序将建立在这一结构之上。

首先,我们要安装Foundation for Apps并创建项目。请确保您已经安装了Ruby(OS X已默认安装)和Node.js,然后遵循Foundation for Apps详细文档中的四个步骤。即便你以前没使用过命令行,这个过程也十分简单。当你完成该些步骤后,在浏览器中输入“http://localhost:8080/#!/”,即可看到应用程序的默认主页。


Foundation for Apps的默认主页 (浏览大图)

让我们熟悉一下项目里的文件和文件夹。

应用程序根目录中唯一需要我们注意的文件是gulpfile.js,它向Gulp构建过程发送指令,让其为应用启动服务。Gulp是一个构建系统,与Grunt非常相似。稍后,如果我们想添加一些AngularJS模块或插件时,可以通过JavaScript、CSS文件(引用了这些模块或插件)来更新该Gulp文件。

 Cient文件夹里能找到其它我们关注的文件夹:

  •  clients/assets/js/app.js,应用程序的控制器、指令和自定义过滤器在该文件中;
  •  应用程序的所有SCSS文件都存放在clients/assets/scss里;
  •  clients/index.html是应用程序的主页模板;
  • 在clients/templates/中可以找到所有页面的模板,其中大多数还未创建。

构建模板和主页面

让我们开始构建吧!index.html页面无法很好地满足实际应用的需要,所以首先修改该页面。我们针对小尺寸屏幕增加了Off-Canvas菜单、切换按钮及漂亮的淡入淡出效果(利用Foundation for Apps中“Motion UI”的类样式实现)。你可以直接从Github repository中index.html文件里复制这些代码。

在_settings.scss文件中添加一些SCSS变量来设置颜色、字体和断点:

  $primary-color: #000;$secondary-color: #ffe306;$body-background: $secondary-color;$breakpoints: (  small: rem-calc(600),  medium: rem-calc(900),  large: rem-calc(1200),  xlarge: rem-calc(1440),  xxlarge: rem-calc(1920),);$h1-font-size: rem-calc(80);$body-font-family: "brandon-grotesque", Helvetica, Arial, sans-serif;$header-font-family: "flood-std", Helvetica, sans-serif;

现在我们要加点儿料美化一下app.scss。你可以直接参考Github repository中的该文件。

接下来,快速重写默认的home.html文件,该文件在clients/templates/ 目录下,此目录列出了所有要建页面的链接菜单:

---name: homeurl: /---<div class="grid-content">  <h1>Star Wars Compendium</h1>  <p class="lead">Foundation for Apps using Star Wars API</p>  <hr>  <ul class="home-list">    <li><a ui-sref="films">Films</a></li>    <li><a ui-sref="species">Species</a></li>    <li><a ui-sref="planets">Planets</a></li>    <li><a ui-sref="people">People</a></li>    <li><a ui-sref="starships">Starships</a></li>    <li><a ui-sref="vehicles">Vehicles</a></li>  </ul></div>

 我们的模板现在看起来已经相当别致——不再是千篇一律的Foundation。


 我们的模板——已经有了些看头(浏览大图)

创建电影列表

我们正大步向前。在templates文件夹中,为首个子页面创建模板文件:films.html。把下面小段代码复制粘贴到顶端:

---name: filmsurl: /films/:id?p=controller: FilmsCtrl---

 这段代码告诉了我们三件事:

  1. Films为该页面名称,在指向该页面的所有链接中可使用;
  2.  URL将有两个可选参数:id(根据我们的数据生成的影片ID)和p(所在电影列表中的页码数);
  3.  我们将使用自定义AngularJS控制器FilmsCtrl,而不是Foundation for Apps自动创建的默认空白控制器。

因为我们要使用自己的控制器,接下来就要在app.js里创建一个(控制器)。浏览下面的控制器,它将被用于电影列表和单个影片页面。你能看到,该控制器保持追踪URL参数,定位我们所在的结果页面,从外部API里获取所需信息(是电影列表还是单个影片的细节,取决于URL参数),并使用$scope变量将这些信息返回到页面视图里。等angular.module声明关闭后,再把它添加到app.js中。

controller('FilmsCtrl',  ["$scope", "$state", "$http",function($scope, $state, $http){  // Grab URL parameters - this is unique to FFA, not standard for  // AngularJS. Ensure $state is included in your dependencies list  // in the controller definition above.  $scope.id = ($state.params.id || '');  $scope.page = ($state.params.p || 1);  // If we're on the first page or page is set to default  if ($scope.page == 1) {    if ($scope.id != '') {      // We've got a URL parameter, so let's get the single entity's      // data from our data source      $http.get("http://swapi.co/api/"+'films'+"/"+$scope.id,          {cache: true })        .success(function(data) {          // If the request succeeds, assign our data to the 'film'          // variable, passed to our page through $scope          $scope['film'] = data;        })    } else {      // There is no ID, so we'll show a list of all films.      // We're on page 1, so the next page is 2.      $http.get("http://swapi.co/api/"+'films'+"/", { cache: true })        .success(function(data) {          $scope['films'] = data;          if (data['next']) $scope.nextPage = 2;        });    }  } else {    // Once again, there is no ID, so we'll show a list of all films.    // If there's a next page, let's add it. Otherwise just add the    // previous page button.    $http.get("http://swapi.co/api/"+'films'+"/?page="+$scope.page,      { cache: true }).success(function(data) {        $scope['films'] = data;        if (data['next']) $scope.nextPage = 1*$scope.page + 1;      });      $scope.prevPage = 1*$scope.page - 1;  }  return $scope;}])  // Ensure you don't end in a semicolon, because more     // actions are to follow.

保存完app.js后,你需要通过终端(Control+ C用来取消操作,然后再运行foundation-app watch)重启服务,以保证应用程序包含该新模板(files.html)文件,而该文件中都创建了新控制器(app.js)。

就是这样,我们有了一个功能完整的控制器,它能从外部RESTful API资源中获取数据,将结果缓存至浏览器的session中,并把数据返回到视图页面中。

再次打开films.html,开始构建可以访问的数据视图。首先增加展示电影列表的视图内容。我们可以访问所有添加到$scope变量中的属性,无需加前缀$scope,如本例中的films、prevPage和nextPage。在模板现有内容下添加如下代码:

<div class="grid-content films" ng-show="films">  <a class="button pagination"    ng-show="prevPage"    ui-sref="films({ p: prevPage })">    Back to Page {{prevPage}}  </a>  <div class="grid-content shrink">    <ul class="menu-bar vertical">      <li ng-repeat="film in films.results">        {{film.title}}      </li>    </ul>  </div>  <a class="button pagination"    ng-show="nextPage"    ui-sref="films({ p: nextPage })">    To Page {{nextPage}}  </a></div>

非常明显!如果有多页的数据,我们就会得到一个电影名称列表和页码数。但这些数据还没有特别明显的用途,接下来我们把影片名称换成了影片页面所对应的链接。

我们计划将影片ID作为URL的id参数。我们已访问影片的url属性,正好包含了影片ID,即最后一个斜杠前的最后一个参数。然而,我们如何才能从访问的URL中获取唯一的ID?AngularJS通过自定义过滤器使其变得很容易。把{{film.title}}封装在一个链接里,为该连接添加ui-sref属性(用来设置内部链接),其值为包含定制过滤器的film.url数据,示例代码如下:

<a ui-sref="films({ id:( film.url | lastdir ), p:'' })">  {{film.title | capitalize}}</a>

现在页面仍处于不可用状态,因为应用无法识别lastdir和capitalize过滤器是什么。我们需要在app.js文件中控制器的后面定义这些过滤器:

.filter('capitalize', function() {  // Send the results of this manipulating function  // back to the view.  return function (input) {    // If input exists, replace the first letter of    // each word with its capital equivalent.    return (!!input) ? input.replace(/([^\W_]+[^\s-]*) */g,      function(txt){return txt.charAt(0).toUpperCase() +        txt.substr(1)}) : '';  }}).filter('lastdir', function () {  // Send the results of this manipulating function  // back to the view.  return function (input) {    // Simple JavaScript to split and slice like a fine chef.    return (!!input) ? input.split('/').slice(-2, -1)[0] : '';  }})

 搞定!现在我们有了电影列表,每部电影都能链接到各自的电影页面。


电影链表:不知为什么,总对前面部分有些担心(浏览大图)。

然而,点击链接后进入的却是一个空白页,因为films.html还只是个完整的电影信息列表,还没有被构建成可以显示具体电影信息的页面。展示电影细节是我们下一步的工作。

展示一部电影的细节

FilmsCtrl控制器里的$scope.film变量(与$scope['film']相同)中已包含了单个影片页面所需的所有数据。所以,重新使用films.html,并增添另一部分内容,该内容只有在单个file变量被设置时才可见。接着我们会为<dl>中的每组<dt>和<dd>中设置一个键值对(key-value pair)。同时要记住film中某些字段,如characters在数组中有多个值,需通过ng-repeat嵌套一一显示出来。为了把每个演员与该演员的页面连接起来,我们将使用在影片列表中用到的同样方法:用lastdir过滤器,根据他/她/它的ID,链接至每个演员对应的people页面。

<div class="grid-content film"  ng-show="film" ng-init="crawl = 'false'">  <h1>Episode {{film.episode_id | uppercase}}:     {{film.title}}</h1>  <hr>  <dl>    <dt>Opening Crawl</dt>    <dd ng-class="{'crawl':crawl === true}"       ng-click="crawl === true ? crawl = false : crawl = true">      {{film.opening_crawl}}</dd>    <dt>Director</dt>    <dd>{{film.director | capitalize}}</dd>    <dt>Producer</dt>    <dd>{{film.producer | capitalize}}</dd>    <dt>Characters</dt>    <dd ng-repeat="character in film.characters"      ui-sref="people({ id:(character | lastdir), p:''})">      {{character}}    </dd>  </dl></div>

可是,当我们浏览每部电影的条目时,演员列表仅显示了与该演员相关的URL,而不是演员的名字。


这些人物到底是谁?这样可不行(观察大图)。

我们需要用演员名字来替换这些URL文本,但是我们还没有这些关键性数据。或许在我们获取film的URL中会包含演员的名字。我们再次打开app.js,并增加getProp命令。

.directive("getProp", ['$http', '$filter', function($http, $filter) {  return {    // All we're going to display is the scope's property variable.    template: "{{property}}",    scope: {      // Rather than hard-coding 'name' as in 'person.name', we may need      // to access 'title' in some instances, so we use a variable (prop) instead.      prop: "=",      // This is the swapi.co URL that we pass to the directive.      url: "="    },    link: function(scope, element, attrs) {      // Make our 'capitalize' filter usable here      var capitalize = $filter('capitalize');      // Make an http request for the 'url' variable passed to this directive      $http.get(scope.url, { cache: true }).then(function(result) {        // Get the 'prop' property of our returned data so we can use it in the template.        scope.property = capitalize(result.data[scope.prop]);      }, function(err) {        // If there's an error, just return 'Unknown'.        scope.property = "Unknown";      });    }  }}])

getProp每次从$http.get返回的数据中返回单一属性,从中我们可以提取出所需要的属性。为了使用该指令,需要把它添加到ng-repeat循环内,就像这样:

<span get-prop prop="'name'" url="character">{{character}}</span>

很好!现在我们有了每个演员的名称及对应页面的链接,而不只是一个不明所以的URL。数据字段的其它数据添加到file页面后,这个页面就算完成了(Github Repository中查看films.html的其余代码)。


这样就好多了(观看大图)

为了重用而重构代码

通过SWAPI文档和应用程序其余部分的规划,我们清楚地看到,所有其它页面的控制器与这个极为相似,只是在获取的数据分类上有些许不同。

根据这一想法,我们把file控制器中代码移至称为genericController的功能函数,并放在app.js最后一个右括号的前面。同时还需要用变量multiple(五个实例)来替换字符串里的'films',用single(一个实例)替换'film',因为它们代表了每个页面实体的复数和单数形式。这正好让我们DRY,是一种易于读取和理解、具有可重用性的代码。

现在我们可以利用新的genericController函数(包含变量数据的复数和单数形式)新建并调用FilmsCtrl控制器,像参数那样:

.controller('FilmsCtrl', function($scope, $state, $http){  $scope = genericController($scope, $state, $http, 'films', 'film');})

很棒!我们有一个可重用的控制器,它能够提取任何给定页面所需的数据,并在一定的样式呈现出来!现在可以在FilmsCtrl后以相同的方式创建其他页面的控制器。

.controller('SpeciesCtrl', function($scope, $state, $http){  $scope = genericController($scope, $state, $http, 'species', 'specie');}).controller('PlanetsCtrl', function($scope, $state, $http){  $scope = genericController($scope, $state, $http, 'planets', 'planet');}).controller('PeopleCtrl', function($scope, $state, $http){  $scope = genericController($scope, $state, $http, 'people', 'person');}).controller('StarshipsCtrl', function($scope, $state, $http){  $scope = genericController($scope, $state, $http, 'starships', 'starship');})

接下来,采用与创建films.html相同的方式,为planets、species、people、starships和vehicles创建模板HTML文件。创建时要参考SWAPI文档里每类数据中的各个字段。

瞧!现在所有页面都显示出正确的数据并相互关联!


完整的应用程序(观看大图)

结束语

应用程序完成了!我们的应用DEMO(下文有链接)由Aerobatic托管,专门针对前端Web应用。在资源库里,你会看到我们增加了一些特殊选项,以利用Aerobatic API网关,该网关设置了一个代理,可以缓存服务器上被请求的API数据。在没有缓存的情况下,该应用即要进行延迟限制又要尽情请求数限制(SWAPI对每个域的请求数量有限制,跟其他APIs一样),因为我们的数据不经常变化,所以在第一次加载之后,服务器缓存使得一切变得非常高速。因为我们限制了onload请求和图像(数量),第一次加载速度较慢也可以接受,而且,在每个加载页面上,为了使应用速度更快,标题菜单会留在该页面上。

在DEMO和资源库里,你能看到我们在详细页面中添加了另一个API调用,它通过Google自定义搜索在Wookieepedia和StarWars.com中抓取每个实体的图像URI。因此,现在每个详细页面上都显示了动态且相关性极高的图像。

看看下面的演示,或者仔细分析隐藏部分和特定Foundation技巧的源代码,或者把仓库下载下来,然后在本地构建并改进它。

  • Star Wars Compendium,Foundation for Apps DEMO展示;
  • Star Wars Compendium Using Foundation for Apps,GitHub上;
  • 源文件下载(ZIP)。

原文链接:Creating A Complete Web App In Foundation For Apps

欢迎加入CSDN前端交流群:218126086,进行前端技术交流。 

免费使用Windows?微软推Windows 8.1 with Bing实验项目 C/C++开发者必不可少的15款编译器+IDE Amazon推荐,Facebook追踪,大数据时代的“狗仔队” NewSQL登场,NuoDB告诉你未来数据库什么样 2014 Unity亚洲开发者大会&#183;中国站:技术课程全面解析 与其坐以待毙不如主动出击 软件如何避免惨遭淘汰 一周消息树:程序员想找好工作?那就学好Linux! 移动周报:开发者必须了解的10大跨平台工具 一周热点:领先Google 150年的数据可视化及WhatsApp架构解析 R语言为Hadoop注入统计血脉 海外游戏市场:Google与“开心农场”谈破局 2014年2月操作系统份额:Windows仍在增长 Win 7以47.31%稳居第一 2014年2月份浏览器份额:IE 8仍全球最受欢迎,Firefox跌破18%大关 跨平台2D游戏引擎V-Play:3天开发一款原生游戏 Appery.io:无编程经验,自己也能DIY移动应用 SAP携手Xamarin和Service2Media 提供移动应用开发框架 8个超实用的jQuery技巧攻略 美国国防部战略:大规模、分布式,构建数字化防御体系 针对小白的Python入门教程——Python使用说明书 耗资460亿美元,天价Olympic上广受诟病的监控和4G LSI AIS ASIA首次登陆中国 探讨最新大数据技术 “iOS in the Car”问世 苹果发布集成汽车服务CarPlay Pinterest联合创始人Evan Sharp:视觉网站标配“网格布局”的设计过程 微软Xbox Live或登陆iOS和Android平台 TIOBE 2014年3月编程语言排行榜:F#直逼Top10 Atlassian面向企业客户推出Git Essentials工具 Mt.Gox破产,都是错误编程惹的祸 Jamo创始人揭底AWS,棱镜阴影下的云行业态势 成本、创新、可靠:游戏公司FunPlus选择AWS的三大理由 全透明、可折叠,平板电脑概念机是这样的 插件大集合!开源包管理器Alcatraz迎来Xcode 5更新 在tdi中,怎样获取封包ip头? 神啊!救救我吧!!!!(在线等待) 我看SARS危机 求助 我该怎么办??? 管理登陆问题解决?? 一个简单的问题,如何对字符串进行减操作? 谁用过struts,进来交流一下! 请大侠看看俺的小程序,哪里错了(关于不规则图形填充) delphi查询问题(急需) 急求:从硬盘安装windowsxp时电脑出显不能安装,找不到eula!如何解决? 系统分析员VS博士 C#连接Oracle? 关于<BASE> 那里有WebDB下载啊. 在ListCtrl里加类似Combo Box的东西,能实现吗? windows2000下vb的一个小问题~~ 如何把当前路径加入查找路径中?立即给分! 对选用不同的纸张大小,在预览中能看出效果吗? 请问怎么在PB6.0中实现Foxpro(*.dbf)的数据导入,到ASA库中 j2me里怎么才能实现图象的滤镜效果?waiting... CDbSet m_dbSet(NULL)在哪一步才能得到一个CDatabase对象的错针? 新手提问:“镜象”是什么意思 求教,如何配置使性能达到最佳,详情见文 怎样在广域网中提高传屏响应速度?帮帮忙!急啊. 在文件钩子当中如何判断是打开文件操作,还是创建文件操作 怎样在applet程序中显示一幅jpeg图片?该图片存在于c:\image\下。 去年12月是谁发的帖子“做项目经理难么” 关于图层拖拽的问题 我有一块硬盘,迈托4.3G,开格式化分时说错误设备或0磁道损坏,后来fdisk分区,启动无效 这是个什么错误啊~ 第一次做控件不明白 给点指点啊 急求:从硬盘安装windowsxp时电脑出显不能安装,找不到eula!如何解决? 不用的控件怎样从工程中删除? 怎样将一个表中的全部数据追加到别一个表的后面????在线 我做软件这些年 求scjd的模拟题 为什么我连续给一个socket send三次,socket一次就接收完了? 关于HTML代码不区分大小写? 大家看一下这个CListCtrl是啥回事?? Turbo c++3.0怎么使用? 《水园MSN俱乐部宗旨》 ODBC连接数据库的一个问题求教 如何让网页一打开就是全屏模式? 关于打印的问题 怎么彻底卸载linux啊!放分100 如何移动无模式窗体? 一个网络版软件的共享使用问题 在线等待!!! 一个网络版软件的共享使用问题 98怎么与xp不能连网玩游戏?高分送!! 有个问题请大虾帮帮忙! 产业组织结构、产业间及产业内部结构个指的是什么?有什么区别? 为什么说常温常压下,8克氧气含有4NA个电子?8克氧气在标况下才是0.25摩尔啊,怎么在常温常压下也是0.25摩尔?常温常压和标况不是不同的吗, 化学怎样学容易一点 甲类低频放大器,其晶体管集电极接扬声器,发射极直接接地,基极只接一个负载电阻,那么这个负载电阻怎么确定?(三极管型号是3AX系列的) 为什么存在万有引力呢? 紫外线的应用 组织机构和组织结构的区别 万有引力存在?假设在一绝对真空中,有两静止物体,根据万有引力定律,两物体会受到相互作用力,从而产生加速度,最后碰撞,能量是不会凭空产生,但为什么凭空产生加速度,产生能量? 食用棉籽油的好处?听说棉籽油适合于高血压患者(不太肯定)不好意思 我想问的是吃棉籽油的好处或益处 组织结构与组织战略的区别 从21千克棉籽中能榨出5.1千克油.照这样计算,7千克棉籽能榨出多少千克油?如果要榨出12.75千克油需要棉籽多少千克?判断下面的量成什么比例?(1)电费的单价一定,用电量和电费总价.( )(2 芦苇造纸残余苇屑能否做机制炭我这附近有用芦苇造纸厂,切苇后剩余的苇屑苇渣等能否做机制炭?做炭的质量怎么样?有没有明白人详细说下 让秋千永远的不停地荡 需满足什么条件是关于物理的能量守恒定律 一种棉籽,每千克出油20分之7千克,200千克棉籽可出油多少千克? 建议书格式(带范文哟!还是给校长的啊!)一定是五百字的呀! 混合物质中怎样萃取我们所需要的部分? 一道化学试剂鉴别的题!下列各物质的无色溶液,不用其它试剂即可鉴别的是!1 KOH Na2SO4 AlCl32 NaHCO3 Ba(OH) H2SO43 HCl NaAlO2 NaHSO44 Ca(OH) NaCO3 BaCl2A.12 B23 C134 D1241 KOH Na2SO4 AlCl32 NaHCO3 Ba(OH) H2SO43 HCl NaAlO2 NaH 司南为什么要做成勺子形? PH试纸上滴入NAcl,试纸变什么颜色 水解反应的方程式如何去写我就是不会写那个关于水解的方程式就是不会分析生成什么,而且反应后生成什么!(显酸星还是碱性) 谁了解干气密封和机械密封,我对此一点不懂,希望能得到详细的解说. 3/8"NPT FEMALE-FEMALE PIPE COUPING. HOCH2CH2NHCOCH2CH3的水解反应方程 万有引力为何存在? 四氟化四硼的空间构型 长期在高温条件下工作的钢材,会产生哪些组织劣化? 为什么存在万有引力? 判断四氟化硫(SF4)的分子空间构型?用VSEPR法判断四氟化硫(SF4)的分子空间构型时,LP不等于0,孤对电子位置有两种情况,用斥力最小原理怎么确定 中国木材产量是世界最多的吗? 请问风能电动车的风能发电机功率是多大,给蓄电池的充电需要经过那些程序原理是什么请问风能电动车的发电机功率是多少,充电的原理是什么需要经过那些程序 灯泡L1“3v,3w”灯泡L2“3v,6w”并联在1.5v电源上,那个灯泡亮 电磁炉保险丝处接假负载(灯泡)开机,加热盘怎么弄 运输衣服400箱每箱运费30元,若损失一箱不但不给运费还陪100元,运完后总运费是8800元,问损失几箱 灯泡给名牌比较哪个更亮这种题怎么算 L1“6v 6w” L2“3V 3W”并联在某电源上 哪个灯更亮,实际功率之比 在三角形中,已知sinA+sinC=psinB,p属于R且ac=1/4b方 若角B为锐角,p的范围 发电机组是以柴油为动能好还是以汽油为动能好? 试药有危险吗? 为什么光学显微镜的目镜通常都是15×? 电站内部可安装柴油发电机组,严禁使用汽油发电机组,这是为何? dna羟基末端怎么念,3’端念什么?5‘端念什么? 地球对光是否存在万有引力? 新买回来的棉质被单、被罩,味道特别重,是什么缘故?对人体有什么危害吗?如何去除?看了你回答蚊帐的题目,是用同样的方法吗? 现在北京还有试药的吗? 电磁炉为什么是在保险串联灯泡在线盘并联灯泡还可以理解,但大家说在保险串联灯泡就不懂了,是代替保险还是串在电路里?我还是个学徒, 急.尼古丁能与什么气体产生化学反应? DNA羟基端是哪个,我怎么觉得是B在遗传病及刑侦破案中常需要对样品DNA进行分析,PCR技术能快速扩增DNA片段,在几个小时内复制出上百万份的DNA拷贝,有效地解决了因为样品中DNA含量太低而难以 电磁炉保险处串联1个灯泡,通电后 灯泡暗红 开机 灯泡稍微亮点 但不闪烁 油脂和尼古丁能反应吗 DNA或RNA中的磷酸含有几个羟基,为什么? 电磁炉一加热烧保险丝怎么修灯泡怎么带 新买了一套被套,有很重的化学印染味道,不知道是不是二氧化硫和硫化氢,洗了几次还是有,新买了一套被套,上面有很重的化学味道,可能是印染的残留,不知道是不是二氧化硫和硫化氢,洗了几 这句话怎么理解,3'端不就是DNA的头吗,(含有羟基) 对于十字相乘法练习题系数不为一的题,如何一眼就看出分解成那两个数如6x²-x-1=(2x-1)(3x+1) 就知道分解成2和3,简略点, 尼古丁和乙醇会发生什么化学反应 端羟基聚丁二烯的红外谱图及其分析? 8g氧气所含电子数为多少摩尔错了,是多少个..lb牛人的答案很好,修改一下就能采用了 尼古丁有什么反应 共发射极放大器中,集电极电阻的作用是什么 常温常压下,3.5gCl2所含电子数?常温常压下,3.5gCl2所含电子数如何计算? 怎么学化学更容易 伊朗死囚受绞刑后未死 司法部长称没必德国总统宣布默克尔现任政府解散 组阁菲总统称菲律宾政府不会就马尼拉人质事俄南部爆炸案致6人亡 女凶手原计划袭财经观察:供应充裕令纽约油价跌破百元印度妇女庆祝传统“女人节” 盛装为夫日本社会“无性症候群”盛行 恐加速人中美发起多国多地区\"天使行动\" 巴西油田竞标引发抗议 示威者与军警冲中国代表在联合国呼吁支持最不发达国家欧盟峰会三大议题考量复苏后劲新西兰外交部呼吁下功夫给予中国游客最被美军生擒基地头目健康良好 申请拖6英警方规定当街小便者需亲自打扫卫生或安倍7小时长会后品尝软柿子 满足称“伊朗死囚受绞刑未死 司法部长称没必要杭州十大赏秋处出榜 灵隐路杨公堤龙井英国乔治小王子受洗仪式23日举行 不日本男教师误会“性暗示” 当众露下体俄罗斯暴力恐怖事件频发 总统普京抨击日本拉平企业与政府薪资差距 全国公务本市下月起调整最低工资标准上港扎台型!公交820路今起改线话说增寿公园惊现绿地毯美核导弹部队考试集体作弊“问题清单”能否终结“隐天蔽日”最后3分钟连得10分今宵灯谜扫一扫给他头上来一铲子“大哥带我进歌坛”春天,我们一起去采莓内页导读形骸久已化心在复何言别蛮干 善因势 善利导邀请探索印度洋英航新广告被批设计演绎城市之美“心态”问题狮峰山上 迎着晨露采龙井周华健人如其歌
备案号:鲁ICP备13029499号-2 说三道四 www.s3d4.cn 说三道四技术文摘