精华内容
下载资源
问答
  • 动态div里script不执行
    千次阅读
    2019-08-06 17:10:01
    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
      <meta charset="UTF-8">
      <title>Title</title>
      <style>
        div {
          height: 200px;
          margin-bottom: 10px;
          background-color: #a43035;
          display: none;
        }
      </style>
      <script>
        
        //等待页面加载完成后才会执行。
        window.onload = function () {
          //不爽的地方:
          //1. 代码比较麻烦,需要遍历,可能还需要嵌套。
          //2. 找对象麻烦,方法少,还长
          //3. 会有兼容性问题。
          //4. 如果想要实现简单的动画效果 animate
          //5. js注册事件,会被覆盖,addEventListener
      
          var btn1 = document.getElementById("btn1");
          var btn2 = document.getElementById("btn2");
          var divs = document.getElementsByTagName("div");
      
          btn1.onclick = function () {
            for (var i = 0; i < divs.length; i++) {
              divs[i].style.display = "block";
            }
          };
      
          btn2.onclick = function () {
            for (var i = 0; i < divs.length; i++) {
              //低版本火狐浏览器不支持innerText,支持textContent
              divs[i].innerText = "我是内容";
            }
          };
        };
      </script>
    </head>
    <body>
    <input type="button" value="展示" id="btn1">
    <input type="button" value="设置内容" id="btn2">
    
    <div></div>
    <div></div>
    <div></div>
    
    
    </body>
    </html>

     

    更多相关内容
  • 关于script标签内脚本不执行的问题

    千次阅读 2021-05-24 21:07:34
    好像是因为指定了src属性,浏览器加载src指定的外部脚本,而不执行script内部的脚本。 MDN的截图: 像下面这样就可以: <script> console.log(222); </script> 因为我贪图方便,直接在引用外部脚本的...

    我也是偶然遇到的。

    <script src="test.js">
        console.log(222);
    </script>
    

    在以上代码中,script标签内的脚本将不会执行。好像是因为指定了src属性,浏览器加载src指定的外部脚本,而不执行script内部的脚本。
    MDN的截图:
    在这里插入图片描述
    像下面这样就可以:

    <script>
        console.log(222);
    </script>
    

    因为我贪图方便,直接在引用外部脚本的script标签内测试一些js的语法,然后居然没执行,就遇到了这个问题。

    人生往往如此,碰到了,分别了,再也不见了。没有那些让人觉得哪怕物是人非,也有故事留心头 ——《剑来》

    展开全文
  • 很多时候,需要通过innerHTML动态插入javascript代码到指定的div中,或者通过ajax请求回来的内容里面包含javascript代码,然后把该代码插入指定的div中,但是插入后的script却无法执行。 原因:直接通过...
    很多时候,需要通过innerHTML动态插入javascript代码到指定的div中,或者通过ajax请求回来的内容里面包含javascript代码,然后把该代码插入指定的div中,但是插入后的script却无法执行。



    原因:直接通过innerHTML动态嵌入的script,浏览器会当做普通的文本,不会当作SCRIPT节点维护到DOM里面,所以调用的时候找不到。

    解决方法:用innerHTML嵌入以后,通过DOM从myDIV中取出嵌入的script节点,然后新创建一个script节点,并把嵌入的script里面的内容也赋给新创建的script节点,然后把这个新节点追加到页面的head节点中,这样就可以调用到里面的函数了。



    比如下面的代码,加上红颜色的内容即可(firefox下测试通过,ie需要再调整一下语法)


    <html>
    <head></head>

    <body>
    <button οnclick="getContent();" name="getContent" id="getContent">Get Content</button>
    <p></p>
    <div id="myDiv"></div>
    <p></p>

    <script type="text/javascript">

    function getContent() {

    var str = "added content \<br\>" +
    "\<input name=\'myname\' id=\'myname\'\>" +
    "\<button οnclick=\'getName()\;\' name=\'getName\' id=\'getName\'\>Get Name\<\/button\>" +
    "\<script type=\'text\/javascript\'\>" +
    "function getName() {" +
    "alert(\'ok\')\;" +
    "document.getElementById(\'myname\').value = \'Bill\'\;" +
    "}" +
    "\<\/script\>";

    document.getElementById("myDiv").innerHTML=str;

    [color=red]var myDivScript = document.getElementById("myDiv").getElementsByTagName("SCRIPT").item(0);
    var newScript = document.createElement("SCRIPT");
    newScript.innerHTML = myDivScript.innerHTML;
    document.getElementsByTagName("HEAD").item(0).appendChild(newScript);[/color]
    }

    </script>
    </body>
    </html>
    展开全文
  • 脚本是则中断线程,待该script脚本执行结束之后程序才继续往下执行。  所以,大部分网上讨论是将script脚本放在&lt;body&gt;之后,那样dom的生成就不会因为长时间执行script脚本而延迟阻塞,...

    首先需要知道:

    html文件是自上而下的执行方式,但引入的css和javascript的顺序有所不同,css引入执行加载时,程序仍然往下执行,而执行到<script>脚本是则中断线程,待该script脚本执行结束之后程序才继续往下执行。

        所以,大部分网上讨论是将script脚本放在<body>之后,那样dom的生成就不会因为长时间执行script脚本而延迟阻塞,加快了页面的加载速度。

        但又不能将所有的script放在body之后,因为有一些页面的效果的实现,是需要预先动态的加载一些js脚本。所以这些脚本应该放在<body>之前。

        其次,不能将需要访问dom元素的js放在body之前,因为此时还没有开始生成dom,所以在body之前的访问dom元素的js会出错,或者无效。

    <!DOCTYPE html>
    <html>
    	<head></head>
    	<script type="text/javascript">
    		document.getElementById("text").innerHTML = "Test script";
    	</script>
    	
    	<body>
    		<h1 id="text"></h1>
    	</body>
    </html>

    控制台将出现:Uncaught TypeError: Cannot set property 'innerHTML' of null
        at test.html?__hbt=1537172343687:5

    将script脚本放在body之后:

    <!DOCTYPE html>
    <html>
    	<head></head>
    	
    	<body>
    		<h1 id="text"></h1>
    	</body>
    	
    	<script type="text/javascript">
    		document.getElementById("text").innerHTML = "Test script";
    	</script>
    </html>

    显示正常。

    总结:   参考认为script放置位置的原则“页面效果实现类的js应该放在body之前,动作,交互,事件驱动,需要访问dom属性的js都可以放在body之后”

     

    参考自:http://www.cnblogs.com/iamwangxupeng/p/4950255.html

    展开全文
  • 调用,但我将它改成div id="a" onclick="a()"调用函数a/div,为什么就调用了了? ``` <script> function a(){ ... } </script> ${pageContext.request.contextPath }/login.action" method=...
  • js动态创建div

    千次阅读 2017-03-20 19:06:32
    js动态创建div1.创建某个标签:如下在body中创建一个div的事例; <script> function fun(){ var frameDiv = document.createElement("div");//创建一个标签 var bodyFa = document.getElementById("bodyid");//通过...
  • div拖拽实现延伸

    万次阅读 2018-07-12 15:00:37
    div拖拽 原理: 鼠标事件 mousedown mousemove mouseup 注意事项: 被拖动的div的position属性值一定是absolute。 onmousedown事件需要在window.onload时加载。 如果被拖动的div上有文字会有自带的文字...
  • 背景:vue项目中用到echarts图表,页面上有侧边栏,侧边栏收缩图表能自适应,想通过监听内容部分的宽度让图表resize,试过window带的resize,只能监听浏览器窗口大小变化,为了监听某元素区域的变化而使echarts的...
  • js动态创建和删除div

    万次阅读 2017-01-20 16:43:03
    研究了一下js的动态生成div功能。特此一记: var i=1; function cDiv(){ var oDiv=document.createElement("div"); oDiv.style.border="1px solid black"; oDiv.style.width="500px"; oDiv.style.height="300px"; ...
  • div左/右键点击执行事件

    千次阅读 2018-01-16 13:53:59
    ////点击子级div时,执行上面方法,可解绑自定义的点击事件 //$(".left-right-click").unbind("mousedown").bind("contextmenu", function (e) {   // e.preventDefault();   // return false; ...
  • innerHTML中script脚本不执行的问题

    千次阅读 2014-02-10 15:53:38
    有一个div1,我希望向后台发送请求,然后这个请求会返回一个html页面代码,我希望把返回内容填充到div1,但是html所包含的script将不会执行。有一个好的办法就是不要用innerHTML,而是用jquery的load方法
  • JS中div动态添加

    千次阅读 2018-10-12 01:48:08
    //添加一个500*500的div快 &lt;div id="aa" style="width:500px;height:500px;background-color:#999;"&gt; &lt;/div&gt; //添加一个500*500的表格 &lt;div id=&...
  • 我有一个具有以下结构的网站: <div id="header"></div> <div id="main"> <div id="navigatio
  • script setup 语法使用

    万次阅读 2021-08-18 14:57:25
    vue3.2正式版已经发布,script setup语法已经由实验性质改为了正式语法,可以放心大胆的在项目中用了。 官方文档:https://v3.cn.vuejs.org/api/sfc-script-setup.html#basic-syntax 相比于常规的composition api...
  • 现在有一个div,这个div里面有一个a标签,div和a都是有点击事件的,但是我想要做到点击a标签的时候就只触发里面a标签的点击事件,执行外层div的点击事件。 使用JQuery可以简单地实现,只需要加入如下代码: ...
  • &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; ...script src=".../script&...script&.../** 定时器执行改变背景色代码*/ ...//页面加载完成后每隔1秒执行一次(循环
  • 最简单的是这样:<inputtype="button"onclick="alert(this.value)"value="我是button"/>...动态添加onclick事件:<inputtype="button"value="我是button"id="bu"> <scripttype="text/javascript"> ...
  • &lt;input id="btnClick" type="button" value="原生写法" class="...div id="pop" class="centerDiv radius" style="width: 260px; height:
  • JavaScript实现点击div改变div的class名称 <!doctype html> <html> <head> <meta charset="utf-8"> <...script type="text/javascript"> function change(x){ ...
  • 我想把以上的天、时、分、秒单独放在下面的几个<div>,让每个框显示对应的数据 ``` <div class="dash days_dash wow zoomIn" data-wow-delay="0.4s"> <div class="digit"> </script></div> ...
  • 1 动态创建节点1-1 通过jsp最原生的方法来创建节点详细说明请查看点击此处查看<!DOCTYPEhtml> <html> <head> <metahttp-equiv="Content-type"content="text/html;charset=utf-8"/> <...
  • 三、<script>元素定义的6个属性。 一、在HTML中引用JavaScirpt脚本的方法有两种:内部嵌入和外部引用。 关于<script>标签的位置问题,虽然<script></script>可以放在...
  • div onload()

    千次阅读 2019-07-26 08:44:46
    本来想实现加载div的时候,使用onload()函数来加载函数,但是发现起作用,查了资料,发现div和p都支持,可以用jQuery的load()来实现它想实现的功能,例如: <div id='resultDIV' onload='funcX()'></...
  • <!doctype html> <... <head> ...meta charset="utf-8">...js自动切换显示div</title> <script src="https://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script&...
  • css+div动态图片切换

    千次阅读 2017-12-18 15:07:26
    1 css+div可以实现动态图片切换。通过修改className。 如:function aaa(){  document.getElementById("div1").className="a1";  document.getElementById("span1").className="a_1";  document....
  • Python-Selenium修改div元素的方法

    万次阅读 2017-10-13 18:43:12
    背景: 在做UI自动化的时候,做好了登陆,但是进入到个人页,一直定位到某个元素。...可以通过代码将这层div给点掉。方法2通过代码将这两层div的display属性改为none 我的代码如下:class OpenAccountLocators:
  • script setup(基本用法)

    千次阅读 2022-02-22 14:57:51
    script setup是 Vue3 的一个新语法糖,相比于普通的语法,简化了组合式API必须return的写法,拥有更好的运行时性能。 组件自动注册 <script lang="ts" setup> import assembly from '../components/Hello...
  • 由于刚写h5没多久,很多基础知识太扎实,导致入坑 html文件如下 <!DOCTYPE html> <html> <head> <title>秒杀详情页</title> </head> <body> <div class="container...
  • 说废话了,看代码 ,该说的都下在注释里面了↓↓ <template> <div :style="getStyle"> <slot/> </div> </template> <script> /** * 据之前的开发,由于每次的 ...
  • 现在,我希望在点击每个div里的发表按钮时,能在js获取{{problem.pro_id}}以及{{problem.user_name}}这两个参数,然后进行传递,写入数据库等等操作 然而,根据一般的写法,按钮点击事件:(’#…’).onclick或者...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 204,110
精华内容 81,644
关键字:

动态div里script不执行