0顶

DOM操作常函数集合精简示例特效

稿源：互联网 2022-06-11 02:02:54 点击： 504 撤稿纠错

DOM操作常函数集合精简示例特效，可自定义

以下讨论的是和函数集合示例特效 dom相关的DOM操作常函数集合精简示例特效教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>DOM操作常函数集合精简</title> </head> <body> <div id="aa">这是在前面的，注意这两个after引用的不同点_after('div')、_after(aa)</div> <a id="url" href="http://www.ask144.cn">国人理财</a> <div id="lwkyy" style="border:1px solid red; padding:1em;">DOM操作常函数集合精简,作用人：lwkyy</div> <input type="button" onclick="_hide('lwkyy')" value="隐藏ID为lwkyy的DIV" /> <input type="button" onclick="_show('lwkyy')" value="显示ID为lwkyy的DIV" /> <input type="button" onclick="_css('lwkyy')" value="设置ID为lwkyy的DIV的样式" /> <input type="button" id="vals" onclick="_val(this)" value="获取这个INPUT的value值" /> <input type="button" id="vals" onclick="_attr('url')" value="设置ID为url的A的title属性值" /> <input type="button" id="vals" onclick="_after('div')" value="在ID为lwkyy的DIV后面建一个DIV" /> <input type="button" id="vals" onclick="_after2(aa)" value="将ID为aa的DIV移动到最后面" /> <script language="javascript"> /** * @author lwkyy,DEVIN,Groups */ Element={}; function $(e){if(e)return Element.extend(typeof(e)=='string'?document.getElementById(e):e);} Element.extend=function(e){ if (e){ for (v in Element.Methods) e[v] = Element.Methods[v]; return e; }else{ return 'undefined'; } }; Element.Methods = { hide: function(){this.style.display = 'none';return this;}, html: function(v){if(v){this.innerHTML = v;return this;}else return this.innerHTML;}, val: function(v){if(v){this.value = v;return this;}else return this.value;}, attr: function(v,k){if(k){this.setAttribute(v,k);return this;} else return this.getAttribute(v);}, css: function(v,k){if(typeof(v)=='object'){for(var i in v){this.style[i] = v[i]};return this;}if(k){this.style[v] = k;return this;} else return this.style[v];}, after: function(e){var e=(typeof(e)=='object')?e:document.createElement(e);this.parentNode.appendChild(e);return $(e)} //注意这返回值 } /* * For Example */ function _hide(id) { $(id).hide(); } function _show(id) { $(id).css('display','block') } function _css(id) { $(id).css({'background':'#369','color':'#FFF'}); } function _val(id) { alert($(id).val()); } function _attr(id) { $(id).attr('title','国人理财'); } function _after(e) { $('lwkyy').after(e).attr('id','ask144').html("建立的这个DIV是全新的，没有出现过的，在用after时得注意基返回的是新建立的或移动过后的节点。"); } function _after2(e) { $('lwkyy').after(e); } </script> </body> </html> <a href="http://js.alixixi.com/">欢迎访问阿里西西网页特效代码站，js.alixixi.com</a>

关于DOM操作常函数集合精简示例特效的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/200805133952.shtml方便下次再访问哦。

·上一篇： 兼容ie及火狐浏览器的点击复制到系统剪贴板的网页特效代码
·下一篇： 仿51job.com城市选择框特效

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

DOM操作常函数集合精简示例特效

文章分类LIST >>返回首页

最新游戏

最新新闻