JQuery对象与JS对象的转换

mac2024-08-09 55

文章目录

1.JQuery快速入门2.JS对象和JQuery对象的转换2.1 js对象转换为 jquery对象2.2 将jquery对象转换为js对象

1.JQuery快速入门

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="js/jquery-3.4.1.min.js"></script> </head> <body> <div id="div1">div1...</div> <div id="div2">div2...</div> </body> <script> //使用JQuery获取元素对象 var div1 = $("#div1"); //获取标签体的内容 alert(div1.html()) var div2 = $("#div2"); alert(div2.html()); </script> </html>

2.JS对象和JQuery对象的转换

2.1 js对象转换为 jquery对象

js–>jquery:${js对象}

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="js/jquery-3.4.1.min.js"></script> </head> <body> <div id="div1">div1...</div> <div id="div2">div2...</div> <script> //1.通过js方式获取名称div的所有html元素对象 var divs = document.getElementsByTagName("div"); //将标签体内容改为aaa for(var i=0;i<divs.length;i++){ // divs[i].innerHTML="aaa"; //将js对象放入$()中即为jquery对象 $(divs[i]).html("ccc"); } </script> </body> </html>

2.2 将jquery对象转换为js对象

jquery–>js:juery对象[索引]或者jquery对象.get(索引)

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script type="text/javascript" src="js/jquery-3.4.1.min.js"></script> </head> <body> <div id="div1">div1...</div> <div id="div2">div2...</div> <script> //2.通过JQuery的方式获取名称div的所有html元素对象 var $divs = $("div"); //将标签体内容改为bbb $divs.html("bbb"); $divs[0].innerHTML="ddd"; $divs[1].innerHTML="eee"; </script> </body> </html>

最新回复(0)