<!DOCTYPE html><html> ???<head> ???????<meta charset="UTF-8"> ???????<title>DOM与JQ对象之间的转换</title> ???????<script src="../../js/jquery-1.8.3.js"></script> ???????<script type="text/javascript"> ???????????function write1(){ ???????????????//1.JS的DOM操作// ???????????????document.getElementById("span1").innerHTML="萌萌哒!"; ???????????????//DOM对象不可以使用JQ对象的属性方法 ???????????????//document.getElementById("span1").html("萌萌哒!"); ???????????????????????????????var spanEle=document.getElementById("span1"); ???????????????????????????????//将DOM对象转换成JQ对象 ???????????????$(spanEle).html("思密达!"); ???????????} ???????????????????????$(function(){ ???????????????$("#btn").click(function(){ ???????????????????//JQ对象无法操作JS里面的属性方法// ???????????????????$("#span11").innerHTML="呵呵哒!" ???????????????????$(‘#span1‘).html("呵呵哒!"); ???????????????????????????????????????//JQ对象向DOM对象转换方式一 ???????????????????$(‘#span1‘).get(0).innerHTML="美美哒!"; ???????????????????????????????????????//JQ对象向DOM对象的转换方式二 ???????????????????$(‘#span1‘)[0].innerHTML="棒棒哒!"; ???????????????}); ???????????}); ???????</script> ???</head> ???<body> ???????<input type="button" value="JS写入" onclick="write1()"/> ???????<input type="button" value="JQ写入" id="btn" /><br /> ???????班长:<span id="span1">你好帅哟!</span> ???</body></html>
DOM和jquery对象之间的转换
原文地址:https://www.cnblogs.com/benjamin77/p/9162135.html