代码如下: document.getElementById("testDiv").innerHTML ="动态创建的div"; 而且用的应该是还是乐此不疲，但是有多少人知道这是错误的做法!错误的原因: (1) 在页面加载时改变了页面的结构. 在IE6中如果网络变慢或者页面内容太大就会出现"终止操作"的错误. 也就是说"永远不要在页面加载时改变页面的Dom模型". (2) 使用修改HTML内容添加元素, 不符合Dom标准. 在实际工作中也碰到过使用这种方法修改内容后, 某些浏览器中并不能立...
动态创建div: 代码如下: $(function(){ $("",{ id: test, text: this is a test, "class": "test", click: function(){ $(this).toggleClass(test); } }).appendTo("body"); }) 动态创建input: 代码如下: $(function(){ $("", { type: text, val: test, focusin: function() { $(this).addClass(active); }, focusout: function() { $(this).removeClass(active); } }).appendTo("body"); })
jQuery的$调用后想要获取DOM元素可以使用get方法，如下 代码如下: // 方式1 $(div).get(1); // 获取页面中第二个div 当然，也可以使用数组索引方式获取 代码如下: // 方式2 $(div)[1]; // 获取页面中第二个div 上面两种方式都可以获取某一个特定的DOM元素，而获取DOM元素集合却要使用toArray方法 代码如下: $(div).toArray(); // 返回页面中所有的div，依次放入数组中 看看get方法的源码 代码如下: get: function( num ) { ...
DOM元素都有一些标准事件，一般使用时只要使用onclick=function的方式就可以了，但是当需要为DOM元素添加多个事件，删除事件，或在用Javascript封装控件的时候，为封装的控件添加自定义事件的时候，onclick=function的方式就不够用了，但是浏览器有addEventListener和attachEvent方法可供调用，从而模拟出类似于C#中的事件委托的事件触发机制！ 代码如下: /* * 功能：事件处理 * Author：LQB * 时间：2009-1-4 * #include JCore.j...
标准规范 HTML5规范文档中指出:如果一个元素符合下面两条规则中的任一条,则window对象中必须要有与之对应的一个属性,属性值就是这个对象.如果一个元素拥有ID属性,那么ID属性的属性值就会成为window对象的属性名. 如果一个元素拥有name属性,那么name属性的属性值就会成为window对象的属性名.但这个元素的标签名必须是: a, applet, area, embed, form, frame, frameset, iframe, img, object,其中的一个. 让我们看一个例子.假定存在...
代码如下: // jquery对象转js对象 $(#search)[0].checked=true; // js对象转jquery对象 var obj = document.getElementById(search); alert($(obj).checked);
在一些复杂的页面中经常会用JavaScript处理一些DOM元素的动态效果，这种时候我们经常会用到一些元素位置和尺寸的计算，浏览器兼容性问题也是不可忽略的一部分，要想写出预想效果的JavaScript代码，我们需要了解一些基本知识。 基础概念 为了方便理解，我们需要了解几个基础概念，每个HTML元素都有下列属性offsetWidthclientWidthscrollWidthoffsetHeightclientHeightscrollHeightoffsetLeftclientLeftscrollLeftoffsetTopclientTop...
代码如下: var totalPanels = $(".scrollContainer").children().size(); alert(totalPanels) 结果为2 累积
1、绑定事件 代码如下: $(#id).bind("click",function(){ ... }) 可一次性绑定多个事件 代码如下: $(#id).bind("click mouseover mouseout",function(){ ... }) 2、解除绑定 代码如下: $(#id).unbind("click") 3、绑定一次 代码如下: $(#id).one("click",function(){ ... })
jquery选择器众多，使用选取某个DOM的方法有很多种，如何在选取的某个元素集上面做一些排除呢？下面通过几个实例说明： 1.选择所有的img元素，排除class=phpernote的元素的个数： 代码如下:$(img:not(.phpernote)).length();//或者$(img).not(.phpernote).length();2.获取id=phpernote下面所有没有class=com的li元素的个数 代码如下:$(#phpernote li:not(.com)).size();//或者$(#phpernote li).not(.com).length();3.设置id=phpern...
测试页面代码： 代码如下: jquery方式，访问iframe页面dom元素 function getIframeDom(){ // 获取iframe的test元素 var test = $("#frame_1").contents().find("#test"); alert(test.html()) } 获取iframe 页面test元素内容 test.html 页面代码 代码如下: iframe页面a.html 我是测试页面test 点击测试按钮效果： JavaScript教程/参考手册 JavaScript热搜 Vue组件中prop属性使用说明实例代码详...
jQuery函数的第二个参数可以指定DOM元素的搜索范围。 第二个参数可分为以下类型 DOM reference jQuery wrapper document 代码示例 代码如下: // search within all form elements, using a wrapper for context, // alerts "8 inputs" alert("selected" + $('input', $('form')).length + ' inputs'); // search with the first form element, using DOM reference as the context, // alerts "4 inputs" alert("selec...
如何一气呵成地，on the fly地操作DOM元素呢？ 例如顺序执行【创建】-> 【修改】-> 【添加】三个动作。 由于jQuery支持链式操作，其实就是设计模式的builder模式，所以我们可以把三个操作串在一起来执行。 首先创建一个p元素，内容包含一个a元素。 代码如下: $(jQuery) 然后为a元素添加一个href属性 代码如下: $(jQuery).find(a).attr(href, http://www.jquery.com) 最后把新添加的p元素添加到body中 代码如下: $(jQuery).fin...
删除 删除操作非常简单，直接在结果集后链式调用remove()方法即可。 例如，要删除以下html脚本中所有的a元素，直接通过 代码如下: $(a.remove(); 就可以做到了。 代码如下: Anchors Anchor Element Anchor Element Anchor Element 当然也可以通过向remove传参的形式来过滤选择结果，然后再执行remove操作。 代码如下: $(a).remove(.remove); 需要注意的是 remove操作并不会把符合条件的元素从结果集中删除，所以理论上可以继...
jQuery的属性操作非常简单，下面以一个a元素来说明属性的获取／设置／删除操作 代码如下: jquery.com 添加属性 $('a').attr('href', 'http://www.jquery.com') 添加多个属性 $('a').attr({'href':'http://www.jquery.com', 'title':'jquery.com'}) 获取属性 $('a').attr('href') class属性 addClass() 添加一个class hasClass() 判断是否有参数中指定的class removeClass() 移除一个class toggleClass() 如果参数中指定的class...