服务咨询热线:0574-88171828 15867435963
专业网站制作客服QQ[853624982]  日本の顧客訪問 [日本語]  
首 页 网站制作 网站推广 域名服务 虚拟主机 VPS主机 企业邮箱 软件开发 经典案例

建站知识

联系我们

网站首页 >> 建站知识

总结AJAX相关JS代码片段和浏览器模型

来源:本站
时间:2009-6-11 16:25:33


在.net开发中,充分利用免费控件是好事情,但是如果不能修改控件达到自己的需求,就要动用JS大法了,前提是研究好浏览器模型 的各种对象的方法属性。尤其是熟悉CSS+HTML就会做的很酷。就JS语言本身来说要求不高。

  1、动态删除Table 里面内容技巧,不需要写太多代码,一行:

tb.removeNode(true)

  2、动态增加行,除了CreateElement方法,还可以这样比较短小:

<table id=tb1></table>
<SCRIPT>
function addTable(){
 var row1 = tb1.insertRow();
 var cell1=row1.insertCell();
 var cell2=row1.insertCell();
 cell1.innerText="灰豆宝宝";
 cell2.innerText="超级大笨狼"
}
</SCRIPT>
<INPUT TYPE = "button" VALUE = "AddTable" onclick = "addTable()">

  3、在DIV中动态增加Table

<SCRIPT>
function addTable(){
 var tb1 = document.createElement("table";
 tb1.border="1px";
 var row1 = tb1.insertRow();
 var cell1=row1.insertCell();
 var cell2=row1.insertCell();
 mydiv.appendChild(tb1);
 cell1.innerText="wanghr100";
 cell2.innerText="panyuguang962"
}
</SCRIPT>
<BODY>
<div id=mydiv style="width:400;height:300;"></div>
<INPUT TYPE = "button" VALUE = "AddTable" onclick = "addTable()">

  4、在DIV中删除Table,简单只要Div.innerHTML=""就可以。

  以上是部分实用相对短小的代码,当然有其他各种办法实现,不过一般都比上面的长,比如组合使用DIV对象的insertAdjacentHTML 方法等,在不同需要下使用不同方法,前提是研究好浏览器模型 的各种对象的方法属性。尤其是熟悉CSS+HTML就会做的很酷。就JS语言本身来说要求不高。

  以下是以Document对象为例,相关方法有:

Method Description
attachEvent
createAttribute
createComment
createDocumentFragment
createElement
createEventObject
createStyleSheet
createTextNode
detachEvent
getElementById
getElementsByName
getElementsByTagName
mergeAttributes
recalc
write
writeln

  以DIV对象为例相关方法有:

addBehavior
appendChild
applyElement
attachEvent
clearAttributes
cloneNode
contains
detachEvent
getAdjacentText
getAttribute
getAttributeNode
getElementsByTagName
hasChildNodes
insertAdjacentElement
insertAdjacentHTML
insertAdjacentText
insertBefore
mergeAttributes
normalize
removeAttribute
removeAttributeNode
removeBehavior
removeChild
removeExpression
removeNode
replaceAdjacentText
replaceChild
replaceNode
setActive
setAttribute
setAttributeNode
setExpression

   其他,比如下拉列表对象,和拖拽操作等我有时间也整理比较一下,实现相同功能,相对比较短的精彩代码是值得收藏的。

  1. removeNode(true) 非IE浏览器不支持的,应该用 obj.parentNode.removeChild(obj);

  2. insertRow(x) insertCell(y) 这个参数是IE里是可以缺省,但是在非IE浏览器里不可缺省

  至于 insertAdjacentElement innerText 这些都是IE的特有方法,而非W3C标准,应该注意。



宁波263企业邮箱
宁波网站建设
:: 在线客服 ::
客服电话
86-0574-88171828
86-015867435963
E-mail:sales@weiwe.cn
在线MSN
在线QQ
宁波网站成功案例
宁波建站知识
网站建设1000元起
.com域名50元,cn第一年50元
购虚拟主机2元/M,赠企业邮局
免费咨询网站问题
网站全球GOOGLE,百度推广
企业网站百度免费推广
宁波外贸网站建设
速代办宁波企业网站备案
本站关键字:宁波网站制作 | 宁波GOOGLE推广 | 宁波做网站 | 宁波网络公司 | 网页制作公司 | 宁波网站推广 | 网页制作 | 宁波软件开发 | 宁波域名注册
首 页 :: 关于我们 :: 联系我们 :: 付款方式 :: 建站知识 :: 新闻动态 :: 友情链接 :: 合作伙伴 :: 网站地图
COPYRIGHT ? 2003-2009 ALL RIGHT RESERVED,WEIWE.CN
威维网络 版权所有   浙ICP备09045242号