這篇文章主要介紹“js中innerText和innerHTML與target和currentTarget的區別”,在日常操作中,相信很多人在js中innerText和innerHTML與target和currentTarget的區別問題上存在疑惑,小編查閱了各式資料,整理出簡單好用的操作方法,希望對大家解答”js中innerText和innerHTML與target和currentTarget的區別”的疑惑有所幫助!接下來,請跟著小編一起來學習吧!
成都創新互聯一直通過網站建設和網站營銷幫助企業獲得更多客戶資源。 以"深度挖掘,量身打造,注重實效"的一站式服務,以成都網站建設、網站制作、移動互聯產品、營銷型網站建設服務為核心業務。十年網站制作的經驗,使用新網站建設技術,全新開發出的標準網站,不但價格便宜而且實用、靈活,特別適合中小公司網站制作。網站管理系統簡單易用,維護方便,您可以完全操作網站資料,是中小公司快速網站建設的選擇。
一、獲取/賦值文本值innerText/textContent、innerHTML
<body> <div id="box_text"> <p >muzidigbig</p> <p >lovely</p> </div> <input type="text" id='getValue' placeholder="輸入值"> <br> <button id="changeText">更改innerText</button> <button id="changeHTML">更改innerHTML樣式</button> </body> <script> window.onload = function () { var textObj = document.getElementById('box_text'); var changeText = document.getElementById('changeText'); var changeHTML = document.getElementById('changeHTML'); var getValue = document.getElementById('getValue'); /* innerText獲取的是純文本值不含html標簽 //獲得元素的里的純文字內容(ie瀏覽器都可以用) var innerText = textObj.innerText; // 獲得非ie里的文字內容 var innerText = textObj.textContent; */ // 短路寫法(在兼容IE和非IE瀏覽器的寫法) var innerText = textObj.innerText || textObj.textContent; //innerHTML獲取的是含有html標簽的文本值 var innerHTML = textObj.innerHTML; console.log(innerText); console.log(innerHTML); changeText.onclick = function(){ textObj.innerText = '木子大大'; } changeHTML.onclick = function(){ textObj.innerHTML = '<h2>可愛的</h2>'; } getValue.onchange = function(){ //value屬性獲得表單值 console.log(getValue.value) } } </script>
二、event對象中 target和currentTarget 屬性的區別。
首先本質區別是:
event.target返回觸發事件的元素對象
event.currentTarget返回綁定事件的元素對象
js中的preventDefault()方法將通知 Web 瀏覽器不要執行與事件關聯的默認動作(如果存在這樣的動作),比如阻止表單提交,阻止鏈接跳轉。
<body> <ul id="ul">ul <li>li<a href="">a</a></li> <li>li<a href="">b</a></li> <li>li<a href="">c</a></li> </ul> </body> <script> var ul = document.getElementById("ul"); ul.onclick = function(event){ var tar = event.target; console.log(tar); var tagName = tar.innerText; console.log("你點擊了:"+tagName); var currentTarget = event.currentTarget; console.log(currentTarget); var currentName = currentTarget.innerText; console.log("你點擊了:"+currentName); // js中的preventDefault() // 該方法將通知 Web 瀏覽器不要執行與事件關聯的默認動作(如果存在這樣的動作),比如阻止表單提交,阻止鏈接跳轉。 event.preventDefault(); } </script>
到此,關于“js中innerText和innerHTML與target和currentTarget的區別”的學習就結束了,希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習,快去試試吧!若想繼續學習更多相關知識,請繼續關注創新互聯網站,小編會繼續努力為大家帶來更多實用的文章!
標題名稱:js中innerText和innerHTML與target和currentTarget的區別
瀏覽路徑:http://m.newbst.com/article22/pgcecc.html
成都網站建設公司_創新互聯,為您提供營銷型網站建設、商城網站、外貿建站、品牌網站設計、電子商務、
聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯