关于Js对页面进行渲染

先做一个测试代码
当前代码测试页面中虽然会出现三个input标签
但是第三个无法被js进行渲染
也就是说input内所输出的内容并不是红色的而是默认的黑色

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
   <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
   <title>Document</title>
   <script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
   <input type="text" class="fuck" />
   <input type="text" class="fuck" />
   <script>
       $('fuck').css('color', 'red');
       var str =$("<input class=\"fuck\">");
       $('body').append(str);
   </script>
</body>
</html>

而稍微切换下js的顺序
input就可以正常渲染

   <script>
       var str =$("<input class=\"fuck\">");
       $('body').append(str);
       $('fuck').css('color', 'red');
   </script>

总结：

页面添加的内容要进行渲染，就一定要在渲染的js之前插入所需要进行渲染的内容
ajxa或datatable进行渲染的页面添加需要js渲染的代码时
需要通过回调函数对页面进行二次渲染

代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
   <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
   <title>Document</title>
   <script src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
   <input type="text" class="fuck" />
   <input type="text" class="fuck" />

   <script>
       init($('.fuck'));
       function init(obj){
           obj.css('color', 'red');
       }//渲染页面中的boj（对象）的color

       var str =$("<input class=\"fuck\">");  
       $('body').append(str);//   对页面进行添加一个html
       init(str);//进行重新渲染


   </script>
</body>
</html>

涉及理解：异域（2015.12.30）

关于Js对页面进行渲染

总结：

代码：

推荐阅读更多精彩内容