js追加子元素

在页面加载完毕后，向div元素追加span子元素

<html>
<head>
<title>js</title>
<script type="text/javascript">
   window.onload=function(){
       var div=document.getElementById("divid");
       var span=document.createElement("span");
       span.id="spanid";
       span.style.color="blue";
       span.innerHTML=" i am append span !"
       div.appendChild(span);
   }
</script>
</head>
<body>
   <div id="divid" style="color: red; font-size:80;">i am div !</div>
</body>
</html>

时间： 2024-10-13 11:23:14

js追加子元素的相关文章

jquery与js添加子元素

例如在select中添加option JQuery做法: <select id="myselect" name="myselect"> </select> $("#myselect").append('<option value="-1">请选择</option>'); js的做法:@参考文章关于 select 的添加 option 应该注意的问题. 标准的做法如上也就是说,标

js添加子元素 table tr td createElement

js代码:增加一行五列的表格 function AddList(){ obj = document.getElementById('tab_g'); $str1 = '1'; $str2 = '2'; $str3 = '3'; $str4 = '4'; $str5 = '5'; newTr = document.createElement('tr'); newTd1 = document.createElement('td'); newTd2 = document.createElement('

原生js获取子元素、给元素增加div

//鼠标移入移出动画 window.onload = function () { var el = document.createElement('div'); el.className = "bg"; var obj_lis = document.getElementById("list").getElementsByTagName("a"); for (i = 0; i < obj_lis.length; i++) { obj_lis[

js追加元素

直接运行 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>js中常用追加元素的几种方法</title> <link rel="stylesheet" href="css/rest.css" /> <style> .container { width: 1200px; padding

js遍历子节点子元素

Js 节点子元素属性方法 // 添加子节点前删除所有子节点 var usernameEle = document.getElementById("username"); var childs = usernameEle.childNodes; for(var i = childs.length - 1; i >= 0; i--) { usernameEle.removeChild(childs[i]); } var username = document.createTe

JS子元素oumouseover触发父元素onmouseout

JavaScript中,父元素包含子元素: 当父级设置onmouseover及onmouseout时,鼠标从父级移入子级,则触发父级的onmouseout后又触发onmouseover:从子级移入父级后再次触发父级的oumouseout后又触发onmouseover.而如果onmouseover内又应用了计时器便会存在较大的问题.下面针对此问题给出解决方案. 首先,在给出解决方案之前,必须先弄清楚几个对象及方法,分别如下: 1.事件对象 2.事件对象相关属性(只针对onmouseover及onm

在Js中得到元素的子元素集合注意事项

http://www.cnblogs.com/phonefans/archive/2008/09/04/1283739.html 在Js中得到元素的子元素集合注意事项费话少说,直接看例子: 1 <ul>2 <li>this's one</li>3 <li>this's two</li>4 <li>this's three</li>5 <li>this's four</li>6 <ul

js 下获取子元素的方法

笔记核心: firstElementChild只会获取元素节点对象,从名称就可以看出来,firstChild则可以获取文本节点对象(当然也可以获取元素节点对象),比如空格和换行都被当做文本节点. js不同于jQuery,在获取DOM时,有很多不方便的地方,哎,没办法,原始的东东,虽然万能,但却不方便. 咱今天在使用原生js的时候,就遇见一个坑------>firstChild,具体是使用firstChild获取元素的第一个子节点,可是相当的悲剧!!! 这个是一个小模型: <div> &l

js jquery 获取元素(父节点,子节点,兄弟节点),元素筛选

转载:https://www.cnblogs.com/ooo0/p/6278102.html js jquery 获取元素(父节点,子节点,兄弟节点) 一,js 获取元素(父节点,子节点,兄弟节点) var test = document.getElementById("test"); var parent = test.parentNode; // 父节点 var chils = test.childNodes; // 全部子节点 var first = test.firstChil