dom元素转化成字符串；字符串html 转换成 实际代码html; innerHTML, outerHTML,

 1、字符串转换成代码

//字符串转换成代码
let stringHtml = '

    
    
    
    
    


    

     


'
// StringHTMl to html
let codeHtml = new DOMParser().parseFromString(stringHtml, 'text/html');
console.info(codeHtml);

打印结果如图：

 2、dom元素转化成字符串

let dom = document.getElementsByClassName('activeBlock')[0];
// 选中的区域块 input dom元素转化成字符串
let inputHtml = dom.querySelector('input').outerHTML;

3、innerHTML与outerHTML的区别

export default {
    mounted(){
        let inHtml = document.getElementById('html').innerHTML;
        let outHtml = document.getElementById('html').outerHTML;
        console.info(inHtml, typeof inHtml, 'inHtml');
        //
hellow world
 string inHtml

        console.info(outHtml, typeof outHtml, 'outHtml');
        //
hellow world
 string outHtml
    }
}

如图：