示例 代码如下: 仅img元素创建后却不添加到文档中会执行onload事件 var img = document.createElement('img'); img.src = "http://www.sinaimg.cn/rny/sinamail57/skins/110318/17/logo.jpg"; img.onload = function(){alert(this.width);}; iframe,script必须添加到文档中后才执行回调。JavaScript教程/参考手册 JavaScript热搜 Vue利用canvas实现移动端手写板的方法vue2.0 移动端实现下拉刷新和上拉加载更...
如下 1,两个div,d1中包含d2 2,d1,d2都设置了absolute或relative 3,隐藏d1 4,隐藏子元素d2 5,显示d1 这时IE6/7 and IE8/9/10(IE7模式)中会发现,子元素d2也能显示出了(别忘了,d2被display:none 了哦)。但IE8/9/10/Firefox5/Safari4/Chrome12中子元素d2仍然是被隐藏的。 重现代码 代码如下: IE6/7 and IE8/9/10(IE7模式)依次隐藏具有absolute或relative的父元素和子元素后再显示父元素,子元素依然能显示bug 1) 隐藏...
我当时的处理方法是在添加的时候手工绑定事件处理函数。不过新版的jquery已经添加了这个功能。我们已经不需要为此烦恼了。 参考:http://api.jquery.com/live/ 以前我们定义事件,比如为元素定义单击事件是这样写的: 代码如下: $(input).click(function () { //处理代码 }); 或 代码如下: $(.clickme).bind(click, function() { // Bound handler called. }); 但是这只能是对已经加载好的元素定义事件,那些后来添加插入的元素...
代码如下: createElement .warpper{ border:1px solid red; padding:8px;} ///动态创建一个div $(function(){ $('',{ id:'test', text:"this is a div", "class":"warpper", click:function(){ var text=$(this).text(); alert(text); } }).appendTo("body"); }); //创建input:text $(function(){ $('',{ type:"text", val:"input text somethings...", name:"userName" }).appendTo("body"); }); //创建input select $(fu...
测试代码如下: 代码如下: 测试 var btn = document.getElementsByTagName('button')[0]; alert(btn.value); alert(btn.getAttribute('value')); IE6/7:IE8/9/10/Firefox/Safari/Chrome/Opera:即: IE6/7 中返回的是innerHTML,实现错误。JavaScript教程/参考手册 JavaScript热搜 Vue利用canvas实现移动端手写板的方法vue2.0 移动端实现下拉刷新和上拉加载更多的示例解决vue-router中的query动态传参问题解决使用vu...
样式:$(function (){ $("要选择的标签").click(function (){alert ("弹出对话框内容");}) }); 第一种:Id选择器 用法: 代码如下: $(function (){ $("p").click(function (){alert ("小P");}) }); 第一个 第二个 说明:对所有标签点击都有弹出对话框的提示 第二种:CSS选择器 代码如下: $(function (){ $(".warning").click(function (){alert("这是警告信息");}); }); .warning{background-color :Yellow ;col...
直接上代码: 代码如下: 鼠标拖拽复制效果 body{ line-height:150% } .show{ display:block} .hide{ display:none} .clone{position: absolute; border:1px solid #666; background-color:#CCCCCC;} .over{ border:1px solid #666;} #left{ float:left; width:200px; border:1px solid #666;} #left li.selected{ background-color:#CCCCCC} #right{ margin-left:220px; border:1px solid #666;} $(function(){ $("#left ...
一、el.setAttribute(class,abc); 代码如下: setAttribute('class', 'abc') .abc { background: red; } test div var div = document.getElementById('d1'); div.setAttribute("class", "abc"); IE6/7 : div背景色不是红色 IE8/9/10/Firefox/Safari/Chrome/Opera : div背景色为红色 结果:IE6/7不支持setAttribute('class',xxx)方式设置元素的class。 二、el.setAttribute('className', 'abc') 代码如下: setAt...
还是要首先引用JQ框架。 然后来看看效果:(连接添加不上)只能暂时看哈图片, 具体效果可参见我博客左方“My Box”中的“玩游戏”: 下面代码中有具体注释。 再来看看代码: 代码如下: 深林冰火人 智商球3 船长的运输船 $(document).ready(function(){ $("#thegameBox a").mousemove(function(ev){ var _Imgsrc="http://files.jb51.net/upload/201109/20110901202741350.jpg";//这里需要将元素name设置和你的图片名字一样 v...
父页面代码 代码如下: 无标题文档 iframe页面代码 代码如下: 无标题文档 $("body",parent.document).append('hahaha'); iframe test--@mybest 在jQuery的文档上有这样的记录: jQuery(html, [ownerDocument]) 参数html String 用于动态创建DOM元素的HTML标记字符串 ownerDocument (可选) Document 创建DOM元素所在的文档 还是要多看,细看文档啊,真是所谓:书读百遍,其义自见啊! ------补记------...
在以往我都是对这些属性死记硬背,很少真正理解过,忘记了就查手册。看完本文我相信这种情况就不会再发生了。 元素占据的物理空间的尺寸 如果你需要获得元素占据的物理空间,那么使用offsetHeight和offsetWidth。 自然而然此物理空间必然包含的有:padding、滚动条、border。这两个属性与getBoundingClientRect()的height和width属性是一致的。 为了帮助理解请看下图: 元素内容的可视区域的尺寸 可视区域包含padding,但是不包含b...
情景一,元素style属性设置了width/height 代码如下: test var div = document.getElementsByTagName('div')[0]; alert(div.style.width); 如上,使用el.style.width即可。如果没有在style属性中设置width,那么使用el.style.width将获取不到,如下 代码如下: test var div = document.getElementsByTagName('div')[0]; alert(div.style.width); 所有浏览器中弹出的是空字符串。即使将样式嵌在页面的css中也仍然获取不到,...
前面写的get()和query()我都省略参数了,先看看文档中的函数原型: Ext.get( Mixed el ) : Element Parameters: el : Mixed The id of the node, a DOM Node or an existing Element. Returns: Element The Element object Ext.query( String path, [Node root] ) : Array Parameters: path : String The selector/xpath query root : Node (optional) The start of the query (defaults to document). Returns: Array query函数返...
代码如下: /** * 克隆元素样式 * @param {HTMLElement} 被克隆的元素 * @param {Boolean} 是否启用缓存(默认true) * @return {String} css类名 */ var cloneStyle = (function (doc) { var rstyle = /^(number|string)$/, cloneName = ${cloneName}, sData = {}, addHeadStyle = function (content) { var style = sData[doc]; if (!style) { style = sData[doc] = doc.createElement(style); doc.getElementsByTagName(head)[0]...
解决思路如下: 首先,判断事件的当前节点,也就是jquery的currentTarget是否在target的包含中,即下面的扩展$.containsNode。 然后,在调用hover的时候的mouseover和mouseout事件里判断currentTarget是否在target的包含中,即$.fn.fhover扩展 下面就是相关代码: 代码如下: $.containsNode = function(parentNode, childNode) { if (parentNode.contains) { return parentNode != childNode && parentNode.contains(childNode); ...