在上篇介绍了选择器的获取标签.id.类名的方法,现在我们在上篇基础上继续升级 1.问题描述:上篇get('选择器')已经实现,如果get方法里是一个选择器的父元素,父元素是DOM对象,那么如何获取元素 思路:1.首先想到的是标签.id.类名的三个方法  2.假设是body节点,那么方法中的document改成body 3.传入的参数如何判断是否为DOM 注意:在获取id方法中全局也只有一个id,所以其中的doument无须修改 修改如下 // 注释: 对获取DOM对象方法的封装 var getT…

选择器模块之传统做法 var tag = function (tag){ return document.getElementsByTagName(tag); } var id = function (id){ return document.getElementById(id); } var className = function (className){ return document.getElementsByClassName(className); } 由浅入深之tag方法 这是ht…

上一篇基本实现了框架结构,但是与真正能用上的项目框架比较还是存在很多不足,在这又做了些加强与优化 (function ( window, undefined ) { var arr = [], push = arr.push, slice = arr.slice, concat = arr.concat; // 构造函数 var YY = function YY ( selector ) { return new YY.fn.init( selector ); }; // 核心原型 YY.fn…

在js中,对样式的操作我们并不感到陌生,在很多框架中都是用极少的代码,实现更强大的功能,在这做出一些的总结.存在不足还望指出! 1.封装一个添加css的方法(这篇引用了前面的框架结构) 在 js 中 获得样式, 默认只能获得行内样式, 类样式与外部样式无法获得, 可以使用计算样式来获得第一次的结果window.getComputedStyle  获得style对象 建议第一次用 注意: 如果是 低版本的 IE 浏览器, 需要使用 currentStyle YY.fn.extend({ css:…

在前端开发的过程中,javascript极为重要的一个功能就是对DOM对象的操作,而对其封装就是为了更好地进行DOM操作,提高浏览器的支持效率 现在给出一个案例:页面创建三个div,然后给其添加样式 1.第一种方法 //第一种方法 var i, node; for ( i = 0; i < 3; i++ ) { node = document.createElement( 'div' ); node.setAttribute( 'class', 'c' ); //node.className =…

在触发DOM上的某个事件时,会产生一个事件对象event.这个对象中包含着所有与事件有关的信息.包括导致事件的元素,事件的类型以及其他与特定事件相关的信息. 例如: 鼠标操作点击事件时,事件对象中会获得鼠标的按键信息等,会提示按的哪一个键 获得鼠标按键属性button和which 鼠标左中右按键分别对应:在谷歌浏览器中   button:左键 0 右键 2 中键 1  ,which:左键 1 右键 3 中键 2 ie8及以下:左键 1 右键 2 中键 4,which属性不存在 用户在操作键盘时,…

在对DOM对象操作时,往往都要涉及到其属性的操作,为了提高开发效率,同时兼顾浏览器的性能,在这简单的封装了几个常见的属性.因为是模块化,在这只是引入了部分代码,其他代码在前几篇模块封装中有写.如有不足,万望提出,谢谢! 1.判断是否有属性,以及设置属性的操作 YY.fn.extend({ attr: function (attName,attValue){ //判断传入参数是否有属性值,没有直接返回属性名 if(arguments.length == 1){ return this[0].att…

1 /** * @description: 引擎的设计与实现 * @user: xiugang * @time: 2018/10/01 */ /* * V1.0: 引擎实现的基本模块思路 * 1.创建一个游戏引擎对象及精灵对象 * 2.将精灵对象添加到引擎中去,并实现播放动画效果以及需要用到的回调方法 * 3.启动引擎 * */ /* * V2.0: 实现游戏循环模块 * 1.如果游戏暂停了,就跳过以下各步骤,并在100毫秒后再次执行游戏循环 * 2.更新帧速率 * 3.设置游戏时间 * 4.清…

选择器引擎涉及相关概念 概念 以Sizzle的主函数声明为例,来说明引擎的相关概念. function Sizzle(selector, context, results, seed) { //... } 种子集seed:如果CSS选择器非常复杂,需要分几步来得到结果,那么第一次得到的元素集合就叫种子集.Sizzle引擎的解析基本上是由右到左,种子集中的一部分就是我们最后得到的元素.如果引擎是由左到右,那么就只是依次查询兄弟与子节点. 结果集results:选择器引擎最终返回的元素集合,约定要与…

JS封装动画框架,网易轮播图,旋转轮播图 1. JS封装运动框架 // 多个属性运动框架 添加回调函数 function animate(obj,json,fn) { clearInterval(obj.timer); obj.timer = setInterval(function() { var flag = true; // 用来判断是否停止定时器 一定写到遍历的外面 for(var attr in json){ // attr 属性 json[attr] 值 //开始遍历 json //…