标签归档：DOM属性

JavaScript select对象之add()方法简介说明


摘要:
下文讲述select对象之add()方法的功能简介说明,如下所示:


select对象之add()方法简介说明

select对象之add()方法的功能:
向一个select对象添加下拉选项
select对象之add()方法的语法:
selectObject.add(option,before)
———参数说明——
selectObject:
此参数为待添加选项的select对象
option:必需,要添加选项元素；option或optgroup元素。
before:必需, 设置下拉项的添加位置，当此参数输入null时，则在下拉项的末尾添加option信息

select对象之 add()方法注意事项:
select 对象 add方法目前支持所有浏览器


select对象之 add()方法 获取举例

 
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.maomao365.com/" />
<title>猫猫教程(www.maomao365.com)
---select对象之add方法举例说明
</title> 
<script type="text/javascript"> 
window.onload=function(){ 
  let oSelect=document.getElementById("ddlSelect");
   
  //创建一个option元素
  var newoption1=document.createElement("option"); 
  newoption1.text="猫猫教程---5"; 
  newoption1.value=5; 
   //将option元素插入到下拉框尾部
  oSelect.add(newoption1,null); 
 
  //创建一个option元素
  var newoption2=document.createElement("option"); 
  newoption2.text="猫猫教程---6"; 
  newoption2.value=6; 
   //将option元素插入到第三个下拉元素的前面
  oSelect.add(newoption2,oSelect.options[2]); 
 
} 
</script> 
</head> 
<body> 
<p>maomao365.com <br />
select 对象之add方法举例演示
</p>
<select id="ddlSelect" > 
  <option value="1">猫猫教程---1</option> 
  <option value="2">猫猫教程---2</option> 
  <option value="3">猫猫教程---3</option> 
  <option value="4">猫猫教程---4</option> 
</select> 
</body> 
</html>
select对象之add方法简介说明

select对象之add方法简介说明

JavaScript select对象之type属性简介说明


摘要:
下文讲述select对象之type属性的功能简介说明,如下所示:


select对象之type对象简介说明

select对象之type属性的功能: select-one”或”select-multiple”
当select对象下拉框为单选时，此时type返回“select-one”
当select对象下拉框为多选时，此时type返回“select-multiple”
select对象之type属性语法:
selectObject.type
———参数说明——
selectObject:
此参数为待获取select对象

select对象之type对象获取举例

 
  <!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.maomao365.com/" />
<title>猫猫教程(www.maomao365.com)
----select对象之type获取方法
</title>
<script>   
window.onload=function(){
  let oSelect = document.getElementById('ddlSelect');   
  let odiv=document.getElementById("messageInfo");
  odiv.innerHTML=oSelect.type;
}
</script>
</head>
<body>
<p>maomao365.com<br />
select对象之type信息获取
</p>
<select id="ddlSelect" multiple>   
  <option value="0">--请选择--</option>  
  <option value="1">猫猫教程---1</option> 
  <option value="2">猫猫教程---2</option>  
  <option value="3">猫猫教程---3</option>  
  <option value="4">猫猫教程---4</option>   
</select>
<div id="messageInfo"></div>
</body>
</html>
select对象之type属性简介说明

select对象之type属性简介说明

JavaScript table对象之deleteCell()方法功能简介说明


摘要:
下文讲述table对象中的deleteCell方法的功能简介说明,如下所示:


table对象之deleteCell()方法简介

table对象之deleteCell()方法功能:
删除表格对象的指定行中指定位置的td单元格
table对象之deleteCell()语法:

  tableRowObject.deleteCell(index)
  -----参数说明----------
  1.tableRowObject:待操作的表格行对象
  2.index:可选,默认值为-1，为最后一个单元格，
	     index值等于0代表第一个单元格,1代表第二个单元格，2代表第三个单元格
	    以此类推 
  table对象之deleteCell()注意事项:
      1.当index值超过单元格个数时,会产生相应的报错信息


table对象之deleteCell()举例说明
 

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.maomao365.com/" />
<title>猫猫教程---table对象之deleteCell()函数举例说明</title>
<script type="text/javascript">
function deleteCell(){
   document.getElementById('trTest').deleteCell(0); 
}
window.onload=function(){
  var oBtn=document.getElementById("btn");
  
oBtn.onclick=function(){
    deleteCell()
  }
}
</script>
</head>
<body>
<table border="1">
  <tr id="top">
    <th>maomao365.com</th>
    <th>猫猫教程</th>
  </tr>
  <tr id="trTest">
    <td>sqlserver教程</td>
    <td>javascript教程</td>
  </tr>
</table>
<br />
<input type="button" id="btn" value="删除单元格"/>
</body>
</html>
table对象之deleteCell删除单元格方法举例说明

table对象之deleteCell删除单元格方法举例说明