JavaScript使用windows对象的open()方法来创建新的浏览器窗口,这个方法有三个参数:windows.open(url,name,features)

参数一:url:是想在新窗口里打开的网页的URL地址。

参数二:name 是新窗口的名字,可以在代码里通过这个名字与新窗口进行通信

参数三:features:是一个以逗号分隔的字符串,其内容是新窗口的各种属性

function popUp(winURL){
    window.open(winURL,"popup","width=320,height=480")
}

这个函数将打开一个320px宽,480px高的新窗口“popup”,当把新的URL地址传递给此函数时,这个函数将把新窗口里的现有文档替换为新URL地址所处的文档,而不是去创建一个新窗口。

用"JavaScript:"伪协议调用popUp()函数:<a href="javascript:popup('http://www.example.com');">Example</a>

结构与样式的分离:

css技术的突出优点,就是文档结构与文档样式的分离可以确保网页都能够平稳退化。

渐进增强:

用一些额外的信息层去包裹原始数据。按照“渐进增强”原则创建出来的网页几乎都符合“平稳退化”原则

外部js文件里把一个事件添加到HTML文档中的某个元素上:element.event=action……

如果想把一个事件添加到某个带有特定id属性的元素上,可以用getElementById就可以:

getElementById(id).event=action

如果事件涉及多个元素:

①把文档的所有链接全放在一个数组中。

②遍历数组

③如果某个链接的class属性等于popup,就表示这个链接在被点击时应该调用popUp()函数

var links=document.getElementsByTagName("a");
for(var i=0;i<links.lenght;i++){
    if(links[i].getAttribute("class")=="popup"){
        links[i].onclick=function(){
            popUp(this.getAttribute("href"));
            return false;
        }
    }
}

以上代码将把调用popUp()函数的onclick事件添加到有关的链接上。

对象检测:只要把某个方法打包在一个if语句里面,就可以根据这条if语句的条件表达式的求值结果是true(这个方法存在)还是false(这个方法不存在)来决定应该采取怎样的行动。

if(!getElementById){
    retrun false;
}//使用“如果不具备,就离开”的判断方式

window.onload=function(){//让这些代码在HTML文档全部加载到浏览器以后马上开始执行
if (!getElementsByTagName) return false;
    var links=document.getElementsByTagName("a");
    for(var i=0;i<links.lenght;i++){
        if(links[i].getAttribute("class")=="popup"){
            links[i].onclick=function(){
                popUp(this.getAttribute("href"));
                return false;
            }
        }
    }    
}

性能考虑:尽量少访问DOM和尽量减少标记

在多个函数都会取得一组类似元素的情况下,可以考虑重构代码,把搜索结果保存在一个全局变量里,或者把一组元素直接以参数形式传递给函数。

合并和放置脚本:包含脚本的最佳方式就是使用外部文件,因为外部文件与标记能清晰地分离开,而且浏览器也能对站点中的多个页面重用缓存过的相同脚本。

把所有<script>标签都放在文档的末尾,</body>标记之前,就可以让页面变得更快。

最新文章

  1. Linux 系统查看物理内存使用率的命令脚本,以百分比形式输出。
  2. Django 1.10 中文文档------3.2.1 模型Models
  3. KTHREAD 线程调度 SDT TEB SEH shellcode中DLL模块机制动态获取 《寒江独钓》内核学习笔记(5)
  4. VirtualBox:Fatal:Could not read from Boot Medium! System Halted解决措施
  5. C和C++中结构体(struct)、联合体(union)、枚举(enum)的区别
  6. css3学习笔记之效果
  7. IIS7构造Gzip压缩
  8. java设计模式之桥接模式
  9. Java栈与堆 (转)
  10. oracle数据库知识点
  11. Nginx安装echo模块
  12. vue组件详解——组件通信
  13. LCA树链剖分
  14. Jenkins自动化构建(二)众多问题
  15. 关于java项目中的XML文件
  16. iOS App Transprot Security
  17. bzoj 4403 序列统计 卢卡斯定理
  18. 使用IDEA工具配置和运行vue项目(详细其中的坑)
  19. 无法连接 Plugins Market 失效的日子
  20. 视差插件parallarx

热门文章

  1. 可视化开发_AppInventor2似乎被抛弃了
  2. Mac 系统变量
  3. UGUI [TextArea]
  4. Kudu的性能测试
  5. ORACLE 查看表空间
  6. C#之Clone
  7. JAVA ------ 大牛
  8. Python常用模块(一)
  9. sharepoint2007就地升级2010系列(四)升级数据库
  10. c++ 处理utf-8字符串