<from> <input type="text" name="name" id="name" value="liwei" /> </from> <div id="txt">woshiliwei</div>
<script> $(function(){ //获取元素的值 js方式 var fromValue=document.getElementById("name").value; var divValue=document.getElementById("txt").innerHTML; console.log(fromValue); console.log(divValue); //改变元素的值 js方式 var fromValue=document.getElementById("name").value="awei"; var divValue=document.getElementById("txt").innerHTML="wuminglin"; console.log(fromValue); console.log(divValue); //获取元素的值 jQuery方式 var a = $("#name").val(); var b = $("#txt").html(); console.log(a); console.log(b); //改变元素的值 jQuery方式 var c = $("#name").val("a"); var d = $("#txt").html("liuguoyang"); console.log(c); console.log(d); }); </script>
控制台输出:
输出的对象 c,d 为jQuery对象,但是元素的值已经改变了。
//1、与内容相关的函数 function textFun(){ //获取的是第一个匹配元素的围堵标签中的所有内容,包括了嵌套在内部的标签 var str1=$("div").html(); console.log(str1); //获取的是第一个匹配元素的围堵标签中的所有文本,不包含标签的内容 var str2=$("div").text(); console.log(str2); //val()只能用在表单项元素中,div不是表单元素,所以val()获取不到任何内容 var str3=$("div").val(); //input是表单项元素,val()可以获取到 var str4=$("input").val(); console.log(str3); console.log(str4); }
与属性相关的函数
//2、与属性相关的函数 function attrFun(){ var img=$("img"); //设置属性 img.attr("src","img/cat.jpg"); img.attr("title","不服!"); //移除属性 img.removeAttr("title"); //获取属性 var src=img.attr("src"); var title=img.attr("title"); console.log(src+"===="+title); //获取checked属性使用prop函数,获取到的值是boolean类型,表示是否被选中 var list=$("input[type='radio']"); for(var i=0;i<list.length;i++){ var flag=$(list[i]).prop("checked"); console.log("checked="+flag); } }