吴宇航_习题11_jquery1.docVIP

配置好jquery完成页面加载完以后打印hello world这个程序 答： script type=text/javascript src=../jquery-1.8.0.min.js/script script src=test.js/script $(init); function init(){ alert(Hello world!); } 什么jquery对象，什么是DOM对象。写一个文本输入框，使用jquery对象和DOM对象的转换方法来转换这两个对象 答： （1）Dom对象即是我们用传统的方法（javaScript）获取的对象;jQuery对象即是用jQuery类库的选择器获取对象; （2） 测试文本框1:input type=text id=id1 name=id1 readonly=readonly value=我是文本框/br button onclick=t8()jq转js测试/button button onclick=t9()js转jq测试/button function t8(){//jq转js var jq=$(#id1); var js=jq[0]; alert(js.value); } function t9(){//js转jq var v= document.getElementById(id1); var f=$(v); alert(f.val()); } 基本选择器:写一个按钮，再写三个输入框分别用id 的方法和.class方法来找到这个输入框并改他们的背景颜色。 答： (1)jQuery脚本代码： function t1(){ $(#id1).addClass(blue); $(#id2).addClass(red); $(#id3).addClass(yellow); } (2)页面前台代码： body button onclick=t1();添加背景颜色/buttonbr 测试文本框1:input type=text id=id1 name=id1 value=/br 测试文本框2:input type=text id=id2 name=id2 value=/br 测试文本框3:input type=text id=id3 name=id3 value=/br /body （3）css样式的style style type=text/css .blue{ background-color: blue; } .red{ background-color: red; } .yellow{ background-color: yellow; } .gray{ background-color:gray; } /style 写一个table第一行用蓝色，最后一行用红色，然后中间每隔一行用灰色。 答： （1）jQuery脚本代码： function t2(){ $(tr:first-child).addClass(blue); $(tr:last-child).addClass(red); var trs=$(tr); for (var i = 1; i trs.length-1; i++) { if(i%2==0){ var a=$(trs[i]); a.css(background-color,gray); // a.addClass(gray); } } }) （2）css样式的style style type=text/css .blue{ background-color: blue; } .red{ background-color: red; } .yellow{ background-color: yellow; } .gray{ background-color:gray; } /style 写一个程序，给一个按钮，点了这个按钮以后，所有的多选框变成选中，所有的单选框 第一个选中，所有的输入框变背景，所有隐藏的div显示出来。 答： (1)页面前台代码： table border=1 style=width: 200px;height: 200px;text-align:center tr tdinput type=checkbox //td td 1-1/td td 1-2/td td 1-3/td /tr tr tdinput type=checkbox //td td 2-1/td td 2-2/td td