文章目录

  • 1. 动态创建scirpt添加到head中
  • 2. 动态创建div语句


1. 动态创建scirpt添加到head中

function loadGa () {
  // 获取head标签，默认位置为0
  var head = document.getElementsByTagName('head')[0]

  // 创建script元素
  var scriptUrl = document.createElement('script')
  // 设置为异步
  scriptUrl.setAttribute('async', true)
  // 创建script语句,添加到src中
  let url = 'https://www....' 
  scriptUrl.src = url
  // 添加到head标签中
  head.appendChild(scriptUrl)
  
  // 创建script语句，多行使用 '\' ，注意语句结尾';'不能省略
  var scriptValue = document.createElement('script')
  let inner = "window.dataLayer = window.dataLayer || []; \
              function gtag(){dataLayer.push(arguments);} \
              gtag('js', new Date()); \
      "
  scriptValue.innerHTML = inner
  // 添加到head标签中
  head.appendChild(scriptValue)
}

2. 动态创建div语句

<html>
<body>
	<!-- div容器 -->
	<div id="container"></div>
	
	<script>
		function loadHtml () {
		  // 获取容器
		  var container = document.getElementById('container')
		  // 创建div，设置属性值
		  var ad_div = document.createElement('div')
		  ad_div.setAttribute('id', Id)
		  ad_div.setAttribute('style', 'min-width: 300px; min-height: 250px; text-align: center;')
		  container.appendChild(ad_div)
		  
		  // 创建script
		  var script = document.createElement('script')
		  script.innerHTML = "js语句"
		  // script添加到div中
		  ad_div.appendChild(script)
		  // 重新添加到容器
		  container.appendChild(ad_div)
			
		  // 移除子节点
		  container.removeChild(ad_div)
		}
	</script>
</body>
</html>