JS学习十七:jQuery对元素内容的操作
在上节,学习了jq选择器的几个方法: html(),val(),addClass(),removeClass()
<div> <p>today is nice day!</p> </div>
元素的内容:是指定义元素的起始标记、到结束标记之间的内容。可以分为文本内容和HTML内容。
文本内容:只包含元素内的文本内容,不包含元素的子元素标签。如以上示例中,div元素的文本内容为 today is nice day!
HTML内容:不仅包含元素的文本内容,还包括元素的子标签。如以上示例中,div元素的HTML内容为 <p>today is nice day!</p>
一、文本内容
<body> <div> <p>today is nice day!</p> </div> <div></div> a:<input type="radio" name="a" id="" value="1"/> b:<input type="radio" name="a" id="" value="1"/> c:<input type="radio" name="a" id="" value="1"/> <select multiple="multiple"> <option>列表1</option> <option selected="selected">列表2</option> <option selected="selected">列表3</option> </select> <script type="text/javascript"> $div = $("div") // 操作文本内容两个方法:text()获取文本内容,text(val)设置文本内容 //如果有多个div,默认text()获取第一个div的内容.如同上节的val(), html() // console.log($div.text()) //text(val)设置文本内容:不仅会替换掉原来的文本内容,也会替换掉HTML标签. //text(val)设置所有匹配的元素.如同上节的val(),html() // console.log($div.text('abc')) // 且不会解析内容中的html标签,会当作文本内容设置. // console.log($div.text('<h1>abc</a1>')) // html()方法,会解析html标签 console.log($div.html('<h1>abc</a1>')) // val()方法,会解析html标签 // console.log($div.val('<h1>abc</a1>')) // console.log($div.val('abc')) // console.log($div.val()) //val还可以为select radio checkbox赋值 $("input").val([1,1,0]) //这里有点问题 $("select").val(["列表1","列表3"]) </script> </body>
posted on 2018-11-24 19:36 myworldworld 阅读(258) 评论(0) 收藏 举报