在.net开发中,充分利用免费控件是好事情,同样的,在PHP的开放中,能使用ajax的类库是可以,但是如果不能修改控件或者类库达到自己的需求,就要动用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
其他,比如下拉列表对象,和拖拽操作等我有时间也整理比较一下,实现相同功能,相对比较短的精彩代码是值得收藏的。
原文链接:/ajax/879877.html