jQuery操作DOM对象

来源：互联网发布：怎么合计多张表格数据编辑：程序博客网时间：2024/05/17 06:58

jQuery操作DOM对象,很简单但是做个例子加深印象

<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>控制DOM对象</title>  <style type="text/css">    *{ margin:0 ; padding:0;}    .iframe{border:solid 1px #888; font-size:13px;}.title{padding:6px ; background-color:#EEE;}.content{padding:8px; font-size:12px;}.tip{ backgroud-color:#EEE; display:none; font-size:12px; padding:8px;}.txt{ border:solid 1px #888;}.btn{ border:solid 1px #888; width:60px;}.w260{ width:260px;} </style></head><body> <div class="iframe">    <div class="title">请输入如下信息:</div>    <div class="content">      姓名:<input id="text" type="text" class="text"/><br />      性别:<input id="Radio1" name="rdoSex" type="radio" value="男"  />男         <input id="Radio2" name="rdoSex" type="radio" value="女"  />女<br />      婚否:<input id="Checkbox1" name="checkbox" type="checkbox"/><br />      <input id="btnSubmit" type="button" value="提交" class="btn" onclick="btn_Click();"/><br /><br />    </div>    <div class="tip" id="tip"></div>  </div></body><script type="text/javascript">    function btn_Click(){//获取文本框的值var oTxtValue = document.getElementById('text').value;var oRadioValue = (Radio1.checked)?"男":"女";var oCheckvalue = (Checkbox1.checked)?"已婚":"未婚";document.getElementById("tip").style.display = "block";document.getElementById("tip").innerHTML = oTxtValue + "<br>" +oRadioValue + "<br>" + oCheckvalue;}</script></html>

0 0