• 01-JQuery学习之DOM对象和JQuery对象


    DOM对象,即是我们用传统的方法(javascript)获得的对象;而通过jQuery获取的对象是jQuery包装集对象,简称jQuery对象,只有jQuery对象才能使用jQuery提供的方法。

    <!DOCTYPE html>
    <html>
    	<head>
    		<meta charset="utf-8">
    		<title>02-Dom对象与Juqer包装集对象</title>
    	</head>
    	<body>
    		<div id="mydiv">文本</div>
    	</body>
    	<!-- 
    		DOM对象
    			通过js方式获取的元素对象(document)
    		JQuery对象
    			通过JQuery方法获取的元素对象,返回的是JQuery包装集
    	 -->
    	<script src="js/jquery-3.6.0.js" type="text/javascript" charset="utf-8"></script>
    	<script type="text/javascript">
    		// DOM对象
    		var divDom = document.getElementById('mydiv');
    		console.log(divDom);
    		var divsDom = document.getElementsByTagName('div');
    		console.log(divsDom);
    		// DOM对象 js获取不存在的元素时
    		var spanDom =  document.getElementsByTagName('span');
    		console.log(spanDom);
    		var spanDom2 = document.getElementById('myspan');
    		console.log(spanDom2);
    		
    		
    		console.log('====================');
    		
    		// JQuery对象
    		var divDom2 = $('#mydiv');
    		console.log(divDom2);
    		
    		var spanJquery = $('#myspan');
    		console.log(spanJquery);
    		
    		console.log('========DOM转JQuery============');
    		// DOM对象转JQuery对象,只需要利用$()方法进行包装即可
    		var divDomToJquery = $(divDom);
    		console.log(divDomToJquery);
    		
    		console.log('========JQuery转DOM============');
    		// JQuery对象转DOM对象,获取对象中指定下标的元素
    		var divJqueryToDom = divDom2[0];
    		console.log(divJqueryToDom);
    		
    	</script>
    </html>
    这世上所有美好的东西,都需要踮起脚尖。
  • 相关阅读:
    YaCy is a free search engine
    html css js dom树到底是什么关系
    清华的搜索课程
    Gentle中的O/R映射Attributes
    PHP headers_sent() 函数
    阿里云服务器怎么设置能让网站发邮件
    关于PHP 开启zlib gzip配置
    thinkphp无法加载控制器:Admin
    阿里云邮件服务器怎么设置才能在QQ邮箱访问,互发邮件?
    linux下配置apachenutch 笨笨熊
  • 原文地址:https://www.cnblogs.com/XMYG/p/14594197.html
Copyright © 2020-2023  润新知