js 造网页布局与内容

最新推荐文章于 2022-03-27 13:03:39 发布

编程之上

最新推荐文章于 2022-03-27 13:03:39 发布

阅读量1.4k

点赞数

分类专栏： javascript

本文链接：https://blog.csdn.net/ruizhengyun/article/details/38072351

版权

javascript 专栏收录该内容

47 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>myCol</title>
<meta name="description" content="">
<meta name="keywords" content="">
</head>
<body>
<script>
	function createEle(oParent,cssJson,tag){
    	var aEle = document.createElement(tag||'div');	//缺省值是'div'
    	// 判断是否存在父级
    	if(oParent){
    		append(oParent,aEle);
    	}
    	// 如果不是空字符串
    	if(css){
    		css(aEle,cssJson);	
    	}
    	return aEle;
    }

    function append(oParent,aEle){
    	return oParent.appendChild(aEle);
    }

    function css(obj,json){
    	for(var attr in json){
    		if(attr =='src' || attr == 'title'){
    			obj[attr] = json[attr];
    		}else{
				obj.style[attr] = json[attr];
			}
		}
    }

    function html(obj,html){
    	return obj.innerHTML = html;
    }

    var aDiv = createEle(document.body,{
    		color:'red',
    		fontSize:'19px',
    		fontWeight:700,
    		border:'1px dotted green',
    		padding:'10px'},aDiv);
    html(aDiv,'Hello World!');

    var oImg = createEle(document.body,{
    		title:'this is a pic',
    		src:'1.png'},'img');
    </script>
</body>
</html>

编程之上

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
js 造网页布局与内容

myCol function createEle(oParent,cssJson,tag){ var aEle = document.createElement(tag||'div'); //缺省值是'div' // 判断是否存在父级 if(oParent){ append(oParent,aEle); } // 如果不是空
复制链接

扫一扫