JQ内容操作

设置 内容和标签

    // document.getElementById('div1').innerHTML = '<h1>我爱学习</h1>'
    // $('#div1').html('<h1>我爱和平</h1>')
    /* 获取 内容和标签 */
    // console.log( document.getElementById('div1').innerHTML );
    // console.log( $('#div1').html() );

text()可以获取或设置元素的文本内容 text 和 innerText只能获取内容，获取不了元素

    // console.log( document.getElementById('div1').innerText );
    // console.log( $('#div1').text() );
    /* 首先会覆盖#div1内部的内容，然后会把标签也显示在页面上 */
    // document.getElementById('div1').innerText = '<p>123</p>'
    // $('#div1').text('<p>123</p>')

区别

    // 用于获取第一个匹配元素的HTML内容或文本内容
    // console.log( $('h1').html() );
    // console.log(document.getElementsByTagName('h1')[0].innerHTML)
    /* jq html方法 设置可以匹配所有的元素（可以设置多个） */
    // $('h1').html('我爱江苏')
    // console.log(document.getElementsByTagName('h1'));
    /* 原生不可以设置多个 */
    // document.getElementsByTagName('h1').innerHTML = 'WOAI'

用于获取所有匹配元素的文本内容

    // console.log($('h1').text());
    /* 原生不可以获取所有匹配元素的文本内容 */
    // console.log(document.getElementsByTagName('h1').innerText)

用于设置所有匹配元素的文本内容

    // $('h1').text('我爱红塔山')
    // console.log(document.getElementsByTagName('h1'));
    /* 原生不可以设置所有匹配元素的文本内容 */
    // document.getElementsByTagName('h1').innerText = '我爱95至尊';