文档章节

非侵入式JavaScript理解

淡风
 淡风
发布于 2014/06/14 12:08
字数 474
阅读 73
收藏 0
点赞 0
评论 0

 

 

在Web的早期阶段,也就是在jQuery出现以前,在同一个文件中混杂JavaScript代码和HTML标记是非常流行的做法。将JavaScript代码作为某个特性的值放入HTML元素中也是再正常不过的了。您可能见过下面这样的onclick处理程序:

<div onclick="javascript:alert('click');">Testing, testing</div>

当时您可能会在标记中嵌入JavaScript代码,因为没有更简单的方法可以用来捕获单击事件。尽管嵌入的JavaScript代码可以实现事件捕获,但是该代码不够整洁。jQuery改变了这种状况,因为jQuery提供了查找元素和捕获单击事件的更好方法。现在可以从HTML特性中移除JavaScript代码了。事实上,可以将JavaScript代码与HTML完全分离。

非侵入式JavaScript(unobtrusive JavaScript)很好地实践了JavaScript代码和标记的分离。可以将所有需要的脚本代码打包到.js文件中。如果查看视图的源代码,您将不会看到有JavaScript代码嵌入在标记中。即使查看视图渲染的HTML标记,也不会看到任何JavaScript代码,脚本留下的唯一痕迹是一个或多个引用JavaScript文件的<script>标签。

您可能已经发现非侵入式JavaScript之所以具有吸引力,主要是因为它遵循了MVC框架设计模式所提倡的关注点分离。它实现了内容显示(由标记实现)和交互行为(由JavaScript实现)的分离。除此之外,非侵入式JavaScript还有其他优势。例如,将所有的脚本代码保存在单独的可下载文件中让浏览器能够在本地缓存脚本文件,从而提高网站的性能。

© 著作权归作者所有

共有 人打赏支持
淡风
粉丝 5
博文 23
码字总数 9450
作品 0
杭州
技术主管
JavaScript中的this指针 理论化this指针的定义

JavaScript现在应用之广泛,远超其他任何语言,只要是一个合格的网站应用,基本上多多少少都会有JS的存在。在JavaScript中,this的指向被不少Coder所不解,但其实JS中的this理解起来也是相当...

superwebmaster ⋅ 05/29 ⋅ 0

ECMAScript 学习笔记(2)--基本类型及语法相关

1、变量名区分大小写; 注意代码块的概念。 变量分为原始值和引用值:原始值存储在栈,引用值存储在堆(引用值一般是一个指针或对象名、函数名)。在C语言中编译的程序占用的内存分为以下几个...

wx599c47c7bdcad ⋅ 05/24 ⋅ 0

[译] JavaScript 如何工作:对引擎、运行时、调用堆栈的概述

原文地址: https://blog.sessionstack.com/how-does-javascript-actually-work-part-1-b0bacc073cf PS: 好久没写东西了,最近一直在准备写一个自己的博客,最后一些技术方向已经敲定了,又可...

小烜同学 ⋅ 2017/11/12 ⋅ 0

NODE高级编程阅读笔记系列(一)

本篇涉及以下主题 node简单介绍 事件驱动编程 模块化 缓冲区处理 Node简单介绍 直接用官方的那句话: Node.js 是一种建立在Google Chrome's V8 引擎上的non-blocking(非阻塞),event-driven(...

可爱的圣诞老人 ⋅ 05/23 ⋅ 0

JavaScript核心概念归纳整理

原文出处: 熊俊漉 JavaScript语言本身是一个庞大而复杂的知识体系,复杂程度不低于任何一门后端语言,本文针对JavaScript语言的核心概念进行简单的梳理,对应的每个知识点仅仅点到为止,不作...

音乐宇Code ⋅ 05/27 ⋅ 0

一篇文章读懂JavaScript的EventLoop

JavaScript的单线程 众所周知JavaScript程序是单线程的执行,也就是说,同一时刻只能做一件事,这也是由于JavaScript本身就是为了浏览器而生,主要用途是用户交互和操作dom,为什么是单线程?...

阳光的记忆 ⋅ 05/10 ⋅ 0

02、Java的lambda表达式和JavaScript的箭头函数

[toc] 前言 在JDK8和ES6的语言发展中,在Java的lambda表达式和JavaScript的箭头函数这两者有着千丝万缕的联系;本次试图通过这篇文章弄懂上面的两个“语法糖”。 简介 Lambda 表达式来源于 ...

weir_will ⋅ 06/14 ⋅ 0

从JS对象开始,谈一谈“不可变数据”和函数式编程

文章转载自:https://segmentfault.com/a/1190000008780076 作为前端开发者,你会感受到JS中对象(Object)这个概念的强大。我们说“JS中一切皆对象”。最核心的特性,例如从String,到数组,再...

朱先忠老师 ⋅ 05/20 ⋅ 0

weex eros框架源码解析

weex eros是基于alibaba weex框架进行二次封装的客户端跨平台开发框架,主要是为前端开发者(可以不用熟悉客户端开发)提供的一站式客户端app开发解决方案。官网地址为:https://bmfe.github...

雅爸学技术 ⋅ 05/27 ⋅ 0

安卓应用安全指南 4.9 使用`WebView`

4.9 使用 原书:Android Application Secure Design/Secure Coding Guidebook 译者:飞龙 协议:CC BY-NC-SA 4.0 使你的应用能够集成 HTML / JavaScript 内容。 4.9.1 示例代码 我们需要采取...

apachecn_飞龙 ⋅ 03/24 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

浅谈springboot Web模式下的线程安全问题

我们在@RestController下,一般都是@AutoWired一些Service,由于这些Service都是单例,所以并不存在线程安全问题。 由于Controller本身是单例模式 (非线程安全的), 这意味着每个request过来,...

算法之名 ⋅ 今天 ⋅ 0

知乎Java数据结构

作者:匿名用户 链接:https://www.zhihu.com/question/35947829/answer/66113038 来源:知乎 著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。 感觉知乎上嘲讽题主简...

颖伙虫 ⋅ 今天 ⋅ 0

Confluence 6 恢复一个站点有关使用站点导出为备份的说明

推荐使用生产备份策略。我们推荐你针对你的生产环境中使用的 Confluence 参考 Production Backup Strategy 页面中的内容进行备份和恢复(这个需要你备份你的数据库和 home 目录)。XML 导出备...

honeymose ⋅ 今天 ⋅ 0

JavaScript零基础入门——(九)JavaScript的函数

JavaScript零基础入门——(九)JavaScript的函数 欢迎回到我们的JavaScript零基础入门,上一节课我们了解了有关JS中数组的相关知识点,不知道大家有没有自己去敲一敲,消化一下?这一节课,...

JandenMa ⋅ 今天 ⋅ 0

火狐浏览器各版本下载及插件httprequest

各版本下载地址:http://ftp.mozilla.org/pub/mozilla.org//firefox/releases/ httprequest插件截至57版本可用

xiaoge2016 ⋅ 今天 ⋅ 0

Docker系列教程28-实战:使用Docker Compose运行ELK

原文:http://www.itmuch.com/docker/28-docker-compose-in-action-elk/,转载请说明出处。 ElasticSearch【存储】 Logtash【日志聚合器】 Kibana【界面】 答案: version: '2'services: ...

周立_ITMuch ⋅ 今天 ⋅ 0

使用快嘉sdkg极速搭建接口模拟系统

在具体项目研发过程中,一旦前后端双方约定好接口,前端和app同事就会希望后台同事可以尽快提供可供对接的接口方便调试,而对后台同事来说定好接口还仅是个开始、设计流程,实现业务逻辑,编...

fastjrun ⋅ 今天 ⋅ 0

PXE/KickStart 无人值守安装

导言 作为中小公司的运维,经常会遇到一些机械式的重复工作,例如:有时公司同时上线几十甚至上百台服务器,而且需要我们在短时间内完成系统安装。 常规的办法有什么? 光盘安装系统 ===> 一...

kangvcar ⋅ 昨天 ⋅ 0

使用Puppeteer撸一个爬虫

Puppeteer是什么 puppeteer是谷歌chrome团队官方开发的一个无界面(Headless)chrome工具。Chrome Headless将成为web应用自动化测试的行业标杆。所以我们很有必要来了解一下它。所谓的无头浏...

小草先森 ⋅ 昨天 ⋅ 0

Java Done Right

* 表示难度较大或理论性较强。 ** 表示难度更大或理论性更强。 【Java语言本身】 基础语法,面向对象,顺序编程,并发编程,网络编程,泛型,注解,lambda(Java8),module(Java9),var(...

风华神使 ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部