Question

我想创建一个带有一些样式的html链接。

现在我正在使用：

$('<a/>').text('sample')
         .attr('href', 'http://www.google.com/').appendTo('body');

$('a').css({
               float: 'right',
               fontFamily: 'Verdana, Arial, Helvetica, sans-serif',
               position: 'static',
               display: 'inline',
               visibility: 'inherit'
          });

但是创建并引用标签2次，是否有更简单的方法呢？像：

$('<a/>').text('sample')
         .attr('href', 'http://www.google.com/').appendTo('body');
         .css({
               float: 'right',
               fontFamily: 'Verdana, Arial, Helvetica, sans-serif',
               position: 'static',
               display: 'inline',
               visibility: 'inherit'
          });

Answer 1

你在错误的地方有分号，终止了方法链。

 .attr('href', 'http://www.google.com/').appendTo('body');
                                                        ^^^

您的代码将是

$('<a/>').text('sample')
     .attr('href', 'http://www.google.com/').appendTo('body')
     .css({
           float: 'right',
           fontFamily: 'Verdana, Arial, Helvetica, sans-serif',
           position: 'static',
           display: 'inline',
           visibility: 'inherit'
      });

Answer 2

尝试

$('<a/>').text('sample')
     .attr('href', 'http://www.google.com/').appendTo('body')
     .css({
           float: 'right',
           fontFamily: 'Verdana, Arial, Helvetica, sans-serif',
           position: 'static',
           display: 'inline',
           visibility: 'inherit'
      });

你在给出“appendTo”后终止方法链接所以“css”将不适用于那里....尝试删除那个分号';'在appendTo（'body'）的末尾包括“css”也

Answer 3

$('<a>').text('sample')
         .attr('href', 'http://www.google.com/')
         .css({
               float: 'right',
               fontFamily: 'Verdana, Arial, Helvetica, sans-serif',
               position: 'static',
               display: 'inline',
               visibility: 'inherit'
          }).appendTo('body');

演示：http://jsfiddle.net/wQLmw/

使用Jquery用css附加html？

3 个答案: